https://blog.csdn.net/playboyanta123/article/details/78349034(原文)vue
目前大多数基于vue的项目都是用vue-cli 建立的。当建立项目完成后,咱们进入到项目目录,启动cmd命令窗口,输入npm install,它就会安装一堆东西(依赖),而后再输入npm run dev, 咱们就能够看到网页了,整个项目启动成功。这就是npm 最强大的地方,只使用简单的两个命令,咱们就可以快速地在本地启动一个项目。node
npm install 就是安装模块,npm run dev 就是执行npm script中的命令。当咱们执行npm命令的时候,它到哪里去找,这就要说到每一个node项目中都有的核心文件package.json 文件。webpack
项目开始时,咱们就要创建这个文件。假设咱们要建立一个node 项目,咱们会新建一个文件夹命名node, 这时咱们就要建立package.json文件。进入node 文件夹,你能够手动建立,就和建立一个txt文件同样,但咱们通常都会使用命令建立,打开cmd 窗口,输入npm init, 这时你要回答几个问题,如name,version 等,输入内容,一路回车键,当你输入yes的时候,package.json 建立成功,你的文件夹中多了这个文件。es6
其中有几个字段比较重要:web
name 项目名称, 你可能在项目中使用过 var express = require(‘express’), require 函数后面的参数,就是package.json 中的name字段,因此这个name必定要简短,且不能有大写,这是规定。vue-cli
version版本号:安装一个模块的时候, 你可能指定过特定的版本号,npm install express @4.13.2, 版本号4.13.2 就是咱们这里的version。版本号有三个组成部分,4:表示的是大版本,通常是重大升级。13:表示的是小版本, 在大版本的基础进行的小的更新,如某个功能废弃了,新增了那个功能。2: 对该版本进行补丁,主要是版本bug的修复。express
script: 咱们在命令行中执行的全部命令都写在这个地方,而后用 npm run 去执行这个命令。npm
项目初始完成后,咱们就能够进行项目开发。在开发过程当中咱们都会用到一些第三方库和 框架,尤为是node 开发, 由于它提供的API 有点底层. 若是想用第三方的东西,就要事先安装。上面说到 安装用的命令是npm install。 npm install express --save --save 是什么意思?--save表示,咱们安装模块的时候,同时把它写到package.json 文件中。这时打开package.json 文件,咱们看到多了一个dependencies字段,它包括了咱们刚安装的express. node中有些es6/es7 的语法不支持,咱们使用的时候,就须要进行转换。这时安装babel. npm install babel-cli babel-preset-es2015 --save–dev --save-dev 又是什么,它也表示安装依模块的时候,把它写到package.json中,不过它写入的不是dependencies, 而是devDependencies中。json
devDependencies 和dependencies 有什么区别?dependencies: 是项目运行时的依赖,就是程序上线后仍然须要依赖,好比express, 咱们程序就是用express 写的,若是没有express, 咱们的程序根本没法运行,更直白一点,dependencies 就是咱们在程序开发的过程当中手动require的模块。进行express 开发时,server.js中,都会写 var express = require(‘express’), 咱们程序直接依赖,因此是dependencies. 浏览器
devDependencies, 开发依赖,就是咱们在开发过程当中须要的依赖。好比babel, 它只负责转换es6+ 到es5, 转换完成后,咱们只要转换后的代码,上线的时候,直接把转换后的代码部署上线,不须要bebal. 这就是开发依赖,只在开发时候起做用, 上线不须要。其实就是咱们在使用webpack开发时,它配置文件里全部的依赖,都是开发依赖。
不管devDependencies仍是dependencies中,安装的模块版本号前面还有符号^, 其实这里还有不少符号也能够无符号,符号主要是限定版本。
"express": "4.15.2" 版本号前面什么符号都没有,它表示固定版本,安装版本时,只会安装这个指定的版本。
"express": "~4.15.2",版本号前面有符号~,它表示安装4.15.x 的版本,只x>3 就能够。在这里,咱们express指定是4.15.2 版本,当咱们npm install 安装的时候,它可能在项目中安装4.15.5或者4.15.6 版本。
"express": "^4.15.2" , 版本号前面有符号^, 它表示能够安装4.x.x 的版本,只要中间的x 大于15就能够。
>=4.15.3 版本号前面有符号>=, 它安装大于咱们指定的版本,就能够。
有时还看到一个*, 表示安装最新版本。
版本号必定要注意,由于有些框架和库在进行版本升级的时候,向后兼容性必较差,容易引发代码冲突。但npm install 进行安装的时候,它默认是^ 符号,若是不符合咱们要求,咱们能够对package.json 进行手动修改,如 把^号改为~, 或直接去掉符号, package.json文件,只是一个文件, 咱们能够手动地进行任何修改。
最后再说一下package.json 中的scripts. 这个字段主要用于运行命令。咱们用es6 写一个hello World项目体验下。在node文件夹中新建index.js
import express from "express";
let app = express();
app.get('/', (req,res)=> {
res.send("hello World")
})
app.listen(8080)
因为node 不支持 import 命令,因此要把它转成require 的形式,这要用到babel 命令: babel index.js –o server.js,因为babel-cli 是安装到本地的,因此不能全局使用,那么这个命令写在什么地方?就是写在scripts 中,
在scripts中的命令,都要用npm run 命令名启动。这时在命令行中输入npm run build,能够看到目录中多了一个server.js文件,再在命令行中输入node server, 就能够启动服务器。浏览器地址栏中输入localhost:8080, 看到hello world.
这里咱们在命令行中输入了两次命令,其实能够把这两个命令合并到 一个命令中,修改scripts 中的build 以下, 直接npm run build 就能够启动服务器。
"build": "babel index.js -o server.js && node server"
npm 也能够作部分的任务自动化。
整个package.json文件以下:
{ "name": "node", "version": "1.0.0", "description": "node project", "main": "server.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "babel index.js -o server.js && node server" }, "author": "", "license": "ISC", "dependencies": { "express": "^4.15.2" }, "devDependencies": { "babel-cli": "^6.24.1", "babel-preset-es2015": "^6.24.1" }}-----------