01 npm init

npm init 命令就可以初始化一个package.json文件。在初始化的过程中，会叫用户输入name, version等等信息，

  1. {
  2.   "name": "test", // 假如项目叫做test
  3.   "version": "1.0.0",
  4.   "description": "",
  5.   "main": "index.js",
  6.   "scripts": {
  7.     "test": "echo \"Error: no test specified\" && exit 1"
  8.   },
  9.   "author": "",
  10.   "license": "ISC"
  11. }

就对其中一些关键的部分做一些记录

main 如果你的包想通过npm发布或者内部使用，那么你需要定义包的主入口，这个里面需要区别于webpack中的打包文件的主入口当然这两个可以是同一个文件名但是对应的意义是不一样的；✨

scripts 如字面意义这是一个脚本管理的文件；这里面是对应npm 中一些脚本命令行的缩写 ✨✨✨

  1. "scripts": {
  2.     "dev": "NODE_ENV=dev webpack-dev-server --progress --hot --host 0.0.0.0 --port 8089",
  3.     "test": "NODE_ENV=test webpack --config webpack.test.config.js --progress",
  4.     "online": "NODE_ENV=production webpack --config webpack.online.config.js --progress",
  5.     "build": "webpack",
  6.     "node": "node server.js"
  7.   },

在命令行输入：npm run dev , 对应的命令就会被执行。这里有一个地方需要注意，当执行npm run xxx 的时候，node_modules/.bin/目录会在运行时被加入系统的PATH变量。上面的例子，当我们在命令行输入：npm run build时，其实真正执行的命令是node_modules/.bin/webpack而不是webpack。所以，当你的webpack并未全局安装时，直接在命令行输入：webpack是会报错的。因为你的webapck是安装在node_modules/.bin/下面的。

dependencies 项目的依赖。通过npm install —save安装的包会出现在这里。注意，不要把测试工具、代码转换器或者打包工具等放在这里。当你在命令行里面使用npm install react —save时，react就会出现在dependencies。默认是安装最新的版本。如果想安装某个特定的版本，可以npm install react@15.6.2。以下的dependencies，格式都是合法的，

你在开发一个组件、工具的时候，会在你的项目中安装 webpack ，webpack-dev-server ，babel，或者测试相关的库 karma 等等。 这些依赖只会在你的项目的开发过程中，或者测试过程中使用。 应该写在 devDependencies 中，如果你写在 dependencies 里，当你组件发布到 npm , 别人在 npm 安装你的库的时候，会额外去安装这些不需要的库。

换而言之 也就是说 dependencies 和对应 devDependencies 仅仅区别于在你的组件发布到了npm上面的时候，别人通过npm下拉你的组件的时候；会自动把dependencies 中的包下载都nodemodule中去，而对应的webpack在打包你的工程时候他是从你的主入口文件中引用树的关系来打包；和这里面的package没有关系；

那么就有另一个问题就是如果你这个组件是需要发布到npm上面的时候，那什么样在包是放到开发模式中？

  1. "dependencies" : { 
  2.     "foo" : "1.0.0 - 2.9999.9999", // 指定版本的范围
  3.     "bar" : ">=1.0.2 <2.1.2", // 同上
  4.     "baz" : ">1.0.2 <=2.3.4", // 
  5.     "boo" : "2.0.1", // 指定某一个版本
  6.     "qux" : "<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0", // 
  7.     "asd" : "http://asdf.com/asdf.tar.gz",  // git+ssh://{组件代码库的ssh地址}#v{组件版本号}
  8.     "til" : "~1.2",  // 安装版本号不低于1.2的1.x的最新版本
  9.     "elf" : "~1.2.3", // 同理
  10.     "two" : "^2.2",  // 安装版本号不低于2.2
  11.     "thr" : "3.3.x", // 同上
  12.     "lat" : "latest", // 最新版本
  13.     "dyl" : "file:../dyl" // 本地文件 可以用于本地的包文件测试；这就是另一个话题了
  14.   }
  15. // 这些描述写法都是可以的

02 npm publish

组件的上传和调试 待续