详解vue-cli 脚手架项目-package.json


Posted in Javascript onJuly 04, 2017

使用vue-cli脚手架新建的项目中,含有package.json。

package.json是npm的配置文件,里面设定了脚本以及项目依赖的库。 npm run dev 这样的命令就写在package.json里。

{ 
 "name": "vue-manage", // 项目名称 
 "version": "1.0.0", // 版本  
 "description": "Reimbursement Manage", // 描述  
 "author": "LXG", // 作者  
 "private": true, //是否私人项目  
 "scripts": { 
  "dev": "node build/dev-server.js", // npm run dev 的 dev,使用node执行 build/dev-server.js 
  "start": "node build/dev-server.js", // npm run start 跑的是同样的命令 
  "build": "node build/build.js", // npm run build 跑的是 node build/build.js // 以下脚本为单元测试用到的脚本 
  // 以下脚本为单元测试用到的脚本 
  "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run", 
  "e2e": "node test/e2e/runner.js", 
  "test": "npm run unit && npm run e2e" 
 }, 
 "dependencies": { // dependencies 设定的是项目里使用的依赖 
  "vue": "^2.2.6", 
  "vue-router": "^2.3.1", 
  "element-ui": "1.3.1", 
  "vue-datasource": "1.0.9", 
  "axios": "^0.15.3", 
  "vue-core-image-upload": "2.1.5", 
  "mockjs": "^1.0.1-beta3", 
  "babel-polyfill": "^6.23.0" 
 }, 
 "devDependencies": { //devDependencies设定的是开发使用的依赖  
  "autoprefixer": "^6.7.2", // 是用于给css3属性自动加属性前缀的 
  "babel-core": "^6.22.1", // babel相关的都是用于处理es6语法的 
  "babel-loader": "^6.2.10", 
  "babel-plugin-transform-runtime": "^6.22.0", 
  "babel-preset-env": "^1.3.2", 
  "babel-preset-stage-2": "^6.22.0", 
  "babel-register": "^6.22.0", 
  "chalk": "^1.1.3", // chalk适用于格式化输出命令行信息的,比如run dev以后的start...  
  "connect-history-api-fallback": "^1.3.0", 
  "copy-webpack-plugin": "^4.0.1", 
  "css-loader": "^0.28.0", // 所有的*-loader都是 webpack的扩展,webpack是把各种资源理解为一个模块,css-loader就是读取css模块的加载器 
  "eslint": "^3.19.0", // eslint 相关是代码格式化检查工具,开启以后要严格遵照它规定的格式进行开发 (我一般把它关了,为了显示特意加上的) 
  "eventsource-polyfill": "^0.9.6", 
  "express": "^4.14.1", // express 用于启动 node http server的服务  
  "extract-text-webpack-plugin": "^2.0.0", 
  "file-loader": "^0.11.1", 
  "friendly-errors-webpack-plugin": "^1.1.3", 
  "html-webpack-plugin": "^2.28.0", // webpack 里载入和处理html的插件 
  "http-proxy-middleware": "^0.17.3", // node server 的中间件工具 
  "webpack-bundle-analyzer": "^2.2.1", 
  "cross-env": "^4.0.0", // 设定环境变量的工具,NODE_ENV变量跟它有关 
  "karma": "^1.4.1",  // karma相关的都是单元测试工具 
  "karma-coverage": "^1.1.1", 
  "karma-mocha": "^1.3.0", 
  "karma-phantomjs-launcher": "^1.0.2", 
  "karma-phantomjs-shim": "^1.4.0", 
  "karma-sinon-chai": "^1.3.1", 
  "karma-sourcemap-loader": "^0.3.7", 
  "karma-spec-reporter": "0.0.30", 
  "karma-webpack": "^2.0.2", 
  "lolex": "^1.5.2", 
  "mocha": "^3.2.0", 
  "chai": "^3.5.0", 
  "sinon": "^2.1.0", 
  "sinon-chai": "^2.8.0", 
  "inject-loader": "^3.0.0", 
  "babel-plugin-istanbul": "^4.1.1", 
  "phantomjs-prebuilt": "^2.1.14", 
  "chromedriver": "^2.27.2", 
  "cross-spawn": "^5.0.1", 
  "nightwatch": "^0.9.12", 
  "selenium-server": "^3.0.1", // 一个版本检查工具  
  "semver": "^5.3.0", // selljs是在node里跑shell命令的工具,比如‘rm -rf'  
  "shelljs": "^0.7.6", 
  "opn": "^4.0.2", // 跨平台的开启文件或者网页的工具 
  "optimize-css-assets-webpack-plugin": "^1.3.0", 
  "ora": "^1.2.0", // 命令行里自动运行的信息提示  
  "rimraf": "^2.6.0", // 跑shell命令 rm-rf 的工具  
  "url-loader": "^0.5.8", // 配合webpack的加载器  
  "vue-loader": "^11.3.4", // 配合webpack的加载器  
  "vue-style-loader": "^2.0.5", // 配合webpack的加载器  
  "vue-template-compiler": "^2.2.6", // vue-template-compiler,可能是配合离线版vue  
  "webpack": "^2.3.3", // webpack相关的用于,把图片,*.vue, *.js, 这些组合成最终的项目,webpack-dev用于跑测试服务器  
  "webpack-dev-middleware": "^1.10.0", 
  "webpack-hot-middleware": "^2.18.0", 
  "webpack-merge": "^4.1.0", 
  "babel-preset-es2015": "^6.22.0", 
  "function-bind": "^1.1.0", 
  "webpack-bundle-analyzer": "^2.2.1"   
 },  // 项目依赖的引擎版本  
 "engines": { 
  "node": ">= 4.0.0", 
  "npm": ">= 3.0.0" 
 }, 
 "browserslist": [ 
  "> 1%", 
  "last 2 versions", 
  "not ie <= 8" 
 ] 
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
使用EXT实现无刷新动态调用股票信息
Nov 01 Javascript
Js+php实现异步拖拽上传文件
Jun 23 Javascript
深入理解JavaScript中的箭头函数
Jul 28 Javascript
JavaScript获取当前cpu使用率的方法
Dec 15 Javascript
使用jQuery Rotare实现微信大转盘抽奖功能
Jun 20 Javascript
wap手机端解决返回上一页的js实例
Dec 08 Javascript
深入理解 JavaScript 中的 JSON
Apr 06 Javascript
解决npm安装Electron缓慢网络超时导致失败的问题
Feb 06 Javascript
vue-devtools的安装步骤
Apr 23 Javascript
微信小程序结合Storage实现搜索历史效果
May 18 Javascript
原生js实现表格循环滚动
Nov 24 Javascript
基于JavaScript实现省市联动效果
Jun 22 Javascript
Angular 2父子组件数据传递之@ViewChild获取子组件详解
Jul 04 #Javascript
详解node如何让一个端口同时支持https与http
Jul 04 #Javascript
Angular 2父子组件之间共享服务通信的实现
Jul 04 #Javascript
jQuery实现动态给table赋值的方法示例
Jul 04 #jQuery
Angular 2父子组件数据传递之局部变量获取子组件其他成员
Jul 04 #Javascript
Angular 4.X开发实践中的踩坑小结
Jul 04 #Javascript
jQuery操作DOM_动力节点Java学院整理
Jul 04 #jQuery
You might like
php获取数组中重复数据的两种方法
2013/06/28 PHP
ThinkPHP实现非标准名称数据表快速创建模型的方法
2014/11/29 PHP
PHP图像裁剪缩略裁切类源码及使用方法
2016/01/07 PHP
实例讲解PHP设计模式编程中的简单工厂模式
2016/02/29 PHP
使用phpQuery获取数组的实例
2017/03/13 PHP
PHP基于SimpleXML生成和解析xml的方法示例
2017/07/17 PHP
PHP基于Closure类创建匿名函数的方法详解
2017/08/17 PHP
php 后端实现JWT认证方法示例
2018/09/04 PHP
微信小程序发送订阅消息的方法(php 为例)
2019/10/30 PHP
DOM Scripting中的图片切换[兼容Firefox]
2010/06/12 Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
2010/11/21 Javascript
JQuery查找DOM节点的方法
2015/06/11 Javascript
Ext JS框架中日期函数的用法及日期选择控件的实现
2016/05/21 Javascript
vue父子组件的嵌套的示例代码
2017/09/08 Javascript
理解 JavaScript EventEmitter
2018/03/29 Javascript
实现一个 Vue 吸顶锚点组件方法
2019/07/10 Javascript
Node.js 实现简单的无侵入式缓存框架的方法
2019/07/21 Javascript
layui--select使用以及下拉框实现键盘选择的例子
2019/09/24 Javascript
JavaScript实现HSL拾色器
2020/05/21 Javascript
python安装与使用redis的方法
2016/04/19 Python
python实现简易版计算器
2020/06/22 Python
对Python3 pyc 文件的使用详解
2019/02/16 Python
Python常用特殊方法实例总结
2019/03/22 Python
将Python字符串生成PDF的实例代码详解
2019/05/17 Python
python 哈希表实现简单python字典代码实例
2019/09/27 Python
python“静态”变量、实例变量与本地变量的声明示例
2020/11/13 Python
Skyscanner台湾:全球知名的旅行比价引擎
2018/07/01 全球购物
国际性能运动服装品牌:Dare 2b
2018/07/27 全球购物
惠普香港官方商店:HP香港
2019/04/30 全球购物
JYSK加拿大:购买家具、床垫、家居装饰等
2020/02/14 全球购物
物流管理毕业生自荐信
2013/10/24 职场文书
建筑工地宣传标语
2014/06/18 职场文书
领导班子自我剖析材料
2014/08/16 职场文书
党员“四风”方面存在问题及整改措施
2014/09/24 职场文书
新生儿未入户证明
2015/06/23 职场文书
openEuler 搭建java开发环境的详细过程
2022/06/10 Servers