npm包里的package.json文件

先看下目前node包里的package.json文件配置vue

{
  "name": "webpack-learn", // 包名 通常采用中划线或者下划线,不建议采用小驼峰的形式命名
  "version": "1.0.0", // 版本
  "description": "vue webpack",
  "main": "dist/main.js",
  "module": "dist/main.js",
  "scripts": {
    "dev": "webpack-dev-server --progress --config build/webpack.config.dev.js --inline --hot",
    "build": "webpack --progress --config build/webpack.config.prod.js",
  },
  "keywords": [
    "webpack init project",
    "webpack",
    "init Project",
    "vue"
  ],
  "engines": {
    "node": ">= 6" // node环境要求
  },
  "author": "cpp",
  "license": "ISC",
  "homepage": "https://github.com/niaogege/webpack-learn", // 项目介绍主页
  "repository": {
    "type": "git",
    "url": "https://github.com/niaogege/webpack-learn.git"
  },
  "files": [
    "dist",
    "src",
    "public"
  ],
  "dependencies": {
    "vue": "^2.6.12"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^8.2.2",
    "clean-webpack-plugin": "^3.0.0",
    ...
  }
}

main / module

Main property in package.json defines package entry point 定义包的出口
简单说: 供项目用import导入的入口,主要做用是暴露此依赖包的出口,好比vue源码里的package.json中这么定义的node

"main": "dist/vue.runtime.common.js", // 运行时用的common版本
  "module": "dist/vue.runtime.esm.js", // 运行用的es版本

若是不定义main,项目中运用依赖包须要这样引用webpack

const VueLoaderPlugin = require('vue-loader/lib/plugin.js');

看了下vue-loader中该文件的出口定义git

const webpack = require('webpack')
  let VueLoaderPlugin = null
  if (webpack.version && webpack.version[0] > 4) {
    // webpack5 and upper
    VueLoaderPlugin = require('./plugin-webpack5')
  } else {
    // webpack4 and lower
    VueLoaderPlugin = require('./plugin-webpack4')
  }
  module.exports = VueLoaderPlugin

devDependencies / dependencies

运行 --save-dev 或者 -D 安装的 插件,被写入到 devDependencies 域里面去,而使用 --save 或者 -S 安装的插件,则是被写入到 dependencies 区块里面去.
npm install 【插件名】或 npm install 【插件名】--save 归属dependencies,表示代码运行时所须要的包。github

npm install 【插件名】--save-dev 归属 devDependencies,表示开发时依赖的插件(即不会打包至线上)。web

dependencies, 生产环境依赖,也就是依赖会被打包到web就用中
devDependencies, 开发环境依赖,不会被打包,是保证web就用能运行起来的根本。npm

区别: json

假设你是一名npm包的开发者,那你发布的包的package.json就须要认真分好所依赖的包究竟是dependencies仍是devDependencies。由于你发布的包是给别人使用的,别人不会去管你是用什么环境开发的,别人要的是最终开发出来的源码。因此,当别人npm命令去安装时:数组

npm install xxx -Dbabel

只会把xxx里的dependencies的包下载下来,而不会去下载devDependencies里面的包。因此在发布npm包的时候,dependencies和devDependencies必定要严格区分开来!!

files

这个就好理解,下载的依赖包里包含的文件名数组,像我在cpp-cli-test这个npm包里的files就是

files: [
    "dist",
    "src",
    "public"
]

由于我不想把npm包里的node_modules文件也上传,因此这里就只包含了三个文件夹

bin

在开发脚手架时候会用到bin字段, 包的命令,好比cpp -V,

"main": "./bin/index.js",
  "bin": {
    "cpp": "./bin/index.js" // 全局注册cpp命令
  },

参考连接