详解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 相关文章推荐
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
Feb 17 Javascript
javascript 特殊字符串
Feb 25 Javascript
js实现的跟随鼠标移动的时钟效果(中英文日期显示)
Jan 17 Javascript
jquery怎样实现ajax联动框(一)
Mar 08 Javascript
AngularJS转换响应内容
Jan 27 Javascript
js实现精确到秒的倒计时效果
May 29 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
May 11 Javascript
基于JavaScript实现无限加载瀑布流
Jul 21 Javascript
微信小程序 获取javascript 里的数据
Aug 17 Javascript
Vue项目中使用jquery的简单方法
May 16 jQuery
vue+layui实现select动态加载后台数据的例子
Sep 20 Javascript
jQuery实现手风琴特效
Jan 11 jQuery
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
桌面中心(二)数据库写入
2006/10/09 PHP
学习php分页代码实例
2013/10/24 PHP
php读取目录及子目录下所有文件名的方法
2014/10/20 PHP
非集成环境的php运行环境(Apache配置、Mysql)搭建安装图文教程
2016/04/12 PHP
PHP实现二维数组去重功能示例
2017/01/12 PHP
Locate a File Using a File Open Dialog Box
2007/06/18 Javascript
JS字符串函数扩展代码
2011/09/13 Javascript
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
一个html5播放视频的video控件只支持android的默认格式mp4和3gp
2014/05/08 Javascript
Ext4.2的Ext.grid.plugin.RowExpander无法触发事件解决办法
2014/08/15 Javascript
webapp框架AngularUI的demo改造之路
2014/12/21 Javascript
封装了jQuery的Ajax请求全局配置
2015/02/05 Javascript
Nginx上传文件全部缓存解决方案
2015/08/17 Javascript
Bootstrap打造一个左侧折叠菜单的系统模板(一)
2016/05/17 Javascript
JS实现微信摇一摇原理解析
2017/07/22 Javascript
本地存储localStorage用法详解
2017/07/31 Javascript
浅谈ng-zorro使用心得
2018/12/03 Javascript
js时间戳转yyyy-MM-dd HH-mm-ss工具类详解
2019/04/30 Javascript
vue-router 路由传参用法实例分析
2020/03/06 Javascript
vue路由分文件拆分管理详解
2020/08/13 Javascript
[44:47]Ti4 循环赛第三日 iG vs NaVi
2014/07/12 DOTA
python实现堆和索引堆的代码示例
2018/03/19 Python
python pygame模块编写飞机大战
2018/11/20 Python
python实现大文件分割与合并
2019/07/22 Python
python批量处理文件或文件夹
2020/07/28 Python
python 利用turtle模块画出没有角的方格
2019/11/23 Python
基于Python编写一个计算器程序,实现简单的加减乘除和取余二元运算
2020/08/05 Python
巴西食品补充剂在线零售商:Músculos na Web
2017/08/07 全球购物
东南亚排名第一的服务市场:kaodim
2019/03/28 全球购物
请假条的格式
2014/04/11 职场文书
2014国庆黄金周超市促销活动方案
2014/09/21 职场文书
公司证明怎么写
2014/09/22 职场文书
2014年村委会工作总结
2014/11/24 职场文书
安全先进个人材料
2014/12/29 职场文书
小学教师教学反思
2016/02/24 职场文书
MATLAB 如何求取离散点的曲率最大值
2021/04/16 Python