npm中package.json详解

通常我们使用npm init命令来创建一个npm程序时,会自动生成一个package.json文件。package.json文件会描述这个NPM包的所有相关信息,包括作者、简介、包依赖、构建等信息,格式是严格的JSON格式。
常用命令

npm i --save packageName 安装依赖包

npm i --save-dev packageName

npm i webpack@1.2.1 安装指定版本的包,版本号用@符号连接

属性介绍

name

name和version是package.json中最重要的两个字段,也是发布到NPM平台上的唯一标识,如果没有正确设置这两个字段,包就不能发布和被下载。

version

包的版本号。如"1.0.0"。

description

包的描述信息,将会在npm search的返回结果中显示,以帮助用户选择合适的包。

keywords

包的关键词信息,是一个字符串数组,同上也将显示在npm search的结果中。

homepage

包的主页地址。

bugs

包的bug跟踪主页地址。

license

包的开源协议名称。

author

包的作者。

contributors, maintainers

包的贡献者,是一个数组。

files(较少用)

包所包含的所有文件,可以取值为文件夹。通常我们还是用.npmignore来去除不想包含到包里的文件。

main

包的入口文件。

bin(较少用)

如果你的包里包含可执行文件,通过设置这个字段可以将它们包含到系统的PATH中,这样直接就可以运行,很方便。

man(较少用)

为系统的man命令提供帮助文档。帮助文件的文件名必须以数字结尾,如果是压缩的,需要以.gz结尾。

"man": ["./man/foo.1", "./man/bar.1", "./man/foo.2" ]

directories(较少用)

CommonJS包所要求的目录结构信息,展示项目的目录结构信息。字段可以是:lib, bin, man, doc, example。值都是字符串。

repository

包的仓库地址。

"repository": {"type": "git","url": "git+https://github.com/rainnaZR/es6-react.git"},

scripts

通过设置这个可以使NPM调用一些命令脚本,封装一些功能。

"scripts": {"start": "babel-node src/pages/index.js","build": "webpack --config config/webpack.config.js","watch": "webpack-dev-server --config config/webpack.config.js --hot --inline --progress"}

config

添加一些设置,可以供scripts读取用,同时这里的值也会被添加到系统的环境变量中。

"config": {"port": "8080"
}

npm start的时候会读取到npm_package_config_port环境变量。

dependencies

指定依赖的其它包,这些依赖是指包发布后正常执行时所需要的,也就是线上需要的包。使用下面的命令来安装:

npm install --save packageName

如果是开发中依赖的包,可以在devDependencies设置。

devDependencies

这些依赖只有在开发时候才需要。使用下面的命令来安装:

npm install --save-dev packageName 

peerDependencies

相关的依赖,如果你的包是插件,而用户在使用你的包时候,通常也会需要这些依赖(插件),那么可以将依赖列到这里。

如karma, 它的package.json中有设置,依赖下面这些插件:

"peerDependencies": {"karma-jasmine": "~0.1.0","karma-requirejs": "~0.2.0","karma-coffee-preprocessor": "~0.1.0","karma-html2js-preprocessor": "~0.1.0","karma-chrome-launcher": "~0.1.0","karma-firefox-launcher": "~0.1.0","karma-phantomjs-launcher": "~0.1.0","karma-script-launcher": "~0.1.0"
}

bundledDependencies

绑定的依赖包,发布的时候这些绑定包也会被一同发布。

optionalDependencies(较少用)

即使这些依赖没有,也可以正常安装使用。

engines(较少用)

指定包运行的环境。

"engines": {"node": ">=0.10.3 < 0.12","npm": "~1.0.20"
}

os(较少用)

指定你的包可以在哪些系统平台下运行。

"os": [ "darwin", "linux", "!win32" ]

cpu(较少用)

可以指定包运行的cpu架构。

private

设为true这个包将不会发布到NPM平台下。

publishConfig(较少用)

这个字段用于设置发布时候的一些设定。尤其方便你希望发布前设定指定的tag或registry。

如下:

{"name": "react","version": "1.0.0","description": "Command line instructions","keywords": ["react","es6","react with es6"],"homepage": "https://github.com/rainnaZR/es6-react","bugs": {"url": "https://github.com/rainnaZR/es6-react","email": "111@163.com"},"license": "ISC","author": "ZRainna","main": "src/pages/index.js","directories": {"tests": "tests","lib":"lib","docs":"docs"},"repository": {"type": "git","url": "git+https://github.com/rainnaZR/es6-react.git"},"scripts": {"start": "babel-node src/pages/index.js","build": "webpack --config config/webpack.config.js","watch": "webpack-dev-server --config config/webpack.config.js --hot --inline --progress"},"babel": {"presets": ["es2015-node5"]},"devDependencies": {"webpack": "^1.13.2","webpack-dev-server": "^1.16.1"},"dependencies": {"babel-loader": "^6.2.5","babel-preset-es2015": "^6.14.0","babel-preset-react": "^6.11.1","react": "^15.3.2","react-dom": "^15.3.2","react-redux": "^4.4.5","react-router": "^2.8.1","redux": "^3.6.0"}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/249887.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

offset系列,client系列,scroll系列回顾

一 scroll系列属性 ——滚动1 scrollHeight/scrollWidth 标签内部实际内容的高度/宽度ele.scrollHeight 有两种情况&#xff0c;当内容超出盒子范围后&#xff0c;返回的是内容的高度&#xff0c;包括padding&#xff0c;从顶部内侧到内容的最外部分。当内容不超出盒子范围…

项目开发中的自我总结

最近忙的要死,因为新开发了两个项目.现在已经测试完毕了,准备部署到线上了. 然后不能白忙活吧,忙活完也得写点总结和经验吧,以后也有个记录. 1.一个bootstrapjquerylayuilaravel 5.4开发的一个后台系统 比较朴素 2.一个前后端分离的vuelaravel 5.4 开发的商家系统 我只负责后端…

webpack.config.js 参数详解

webpack.config.js文件通常放在项目的根目录中&#xff0c;它本身也是一个标准的Commonjs规范的模块。 var webpack require(webpack); module.exports {entry: [webpack/hot/only-dev-server,./js/app.js],output: {path: ./build,filename: bundle.js},module: {loaders: …

数组黑科技(偏性能方面)未完待更新...

数组去重最优解&#xff1a;Array.prototype.unique function () {var tmp new Map();return this.filter(item > {return !tmp.has(item) && tmp.set(item,1);})}搭配使用 Array.from(foo); // ["f", "o", "o"]let s new Set([f…

控制台添加log4net

1.添加nuget包 log4net 2.app.config配置 <?xml version"1.0" encoding"utf-8"?> <configuration> <configSections><section name"log4net" type"log4net.Config.Log4NetConfigurationSectionHandler, log4net&quo…

记一次vue 普通异步请求微信二进制二维码 乱码 问题解决然后渲染

后端压力大&#xff0c;前端分忧。 /*用微信小程序token拿二维码*/ async fetchMINIQRcode({commit,state},params){var instance axios.create({responseType: blob, //返回数据的格式&#xff0c;可选值为arraybuffer,blob,document,json,text,stream&#xff0c;默认值为js…

vue-cli项目中.postcssrc.js

module.exports {"plugins": {"postcss-import": {}, //用于import导入css文件"postcss-url": {}, //路径引入css文件或node_modules文件"postcss-aspect-ratio-mini": {}, //用来处理元素容器宽高比"postcss-…

本地存储cookie和localStorage区别特点

一、cookie cookie算是比较早的技术&#xff0c;最初是为了记录http的状态&#xff0c;提高访问速度。cookie是服务器"种植"在客户端的key-value形式文本文件。但同时客户端也能操作cookie。特点&#xff1a; 大小&#xff1a;cookie的大小限制在4k。每个域名下cooki…

VUE 中 使用 iview Form组件 enter键防止页面刷新

<Form :label-width"100" inline label-positionleft keydown.native.enter.prevent "()>{}">或者使用官方的 submit.native.prevent转载于:https://www.cnblogs.com/smzd/p/9197915.html

mybatis中#和$区别

在Mybtis中的Mapper映射文件中&#xff0c;sql语句传参有两种方式#{}和${} 一般来说&#xff0c;我们通常使用的是#{}&#xff0c;这里采用的是预编译机制&#xff0c;防止SQL注入&#xff0c;将#{}中的参数转义成字符串&#xff0c;例如&#xff1a; 执行SQL&#xff1a;Selec…

mysql 字段存储多个值 ,判断一个值是否在其中

表C_file,其中有个字段是spile&#xff0c;他存的是字符形式&#xff0c;例如&#xff1a; id spile 1 2,10,11 2 2,3,20,22 3 1,6,8 4 5,6,1,9 select * from C_file where spile LIKE %1% 如果这样查询的话&#xff0c;会查询出ID为1、3、4&#xff0c;但正确的应该是3、…

touchWX 自定义组件以及传值

创建如图文件 index.wxc: <template><view class"wx-test" bindtap"handleTap">{{ msg }}{{dataIndex}}</view> </template> <script>export default {properties: {dataIndex: {type: String,value: default value,}},data…

vue 初始框架

VueJs讲解初始框架 一、启动项目 第一步&#xff1a;cmd进入项目文件里&#xff0c;运行npm run dev 启动项目 这里说明启动端口号是8080 第二步&#xff1a;往页面输入&#xff1a;localhost:8080 二、解析渲染步骤 先看整体框架样式和index.html&#xff1a; 从上面我…

Codeforces 914D - Bash and a Tough Math Puzzle 线段树,区间GCD

题意: 两个操作, 单点修改 询问一段区间是否能在至多一次修改后,使得区间$GCD$等于$X$ 题解: 正确思路; 线段树维护区间$GCD$,查询$GCD$的时候记录一共访问了多少个$GCD$不被X整除的区间即可,大于一个就NO 要注意的是,如果真的数完一整个区间,肯定会超时,因此用一个外部变量存储…

Country Road Aizu - 2104

题目链接&#xff1a; https://vjudge.net/problem/Aizu-2104 题解&#xff1a; 咋说啊&#xff0c;一言难尽&#xff0c;花了半小时写出来的&#xff0c;卡了十分钟才恍然大明白是排序。 具体就是让每个村子都通上电&#xff0c;变压器在的村子&#xff0c;与变压器连线点线长…

touchWX使用 echarts

<button bindtap"init" wx:if"{{!isLoaded}}">加载图表</button><button bindtap"dispose" wx:if"{{isLoaded && !isDisposed}}">释放图表</button><ec-canvas het"200" classmy_echart…

vue init webpack vue-demo01复杂安装的详解

终端cmd,在项目中输入下面命令&#xff1a; E:\Vue>vue init webpack vuedemo02 接着就会让你输入或者选择一些是不是要的东西 ? Project name vuedemo02(项目名称) ? Project description A Vue.js project(描述&#xff0c;我默认了) ? Author simalinjia(作者名称) ?…

JAVA EE 基本了解

1、 为什么需要JavaEE 我们编写的JSP代码中&#xff0c;由于大量的显示代码和业务逻辑混淆在一起&#xff0c;彼此嵌套&#xff0c;不利于程序的维护和扩展。当业务需求发生变化的时候&#xff0c;对于程序员和美工都是一个很重的负担。 为了程序的易维护性和可扩展性&#xf…

vue-cli中config目录下的index.js文件详解

// see http://vuejs-templates.github.io/webpack for documentation. // path是node.js的路径模块&#xff0c;用来处理路径统一的问题 var path require(path)module.exports { // 下面是build也就是生产编译环境下的一些配置build: { // 导入prod.env.js配置文件&#xf…

Business Intelligence——SSIS项目从创建到部署的简单总结(二)

在上一篇博客中&#xff0c;我们成功的把包导进了SQL Server中&#xff0c;那么接下来我们就为其创建作业&#xff0c;使数据库能够自动执行我们的任务。首先&#xff0c;我们需要启动“SQL Server 代理”。如图1&#xff1a;图1在“SQL Server 代理”的子节点中&#xff0c;选…