详解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"
]
}
package.json
详解vue-cli脚手架项目-package.json的更多相关文章
- vue-cli 脚手架项目-package.json
使用vue-cli脚手架新建的项目中,含有package.json. package.json是npm的配置文件,里面设定了脚本以及项目依赖的库. npm run dev 这样的命令就写在packag ...
- vue cli脚手架项目利用webpack给生产环境和发布环境配置不同的接口地址或者不同的变量值。
废话不多说,直接进入正题,此文以配置不同的接口域名地址为例子 项目根目录下有一个config文件夹,基础项目的话里面至少包括三个文件, 1.dev.env.js 2.index.js 3.prod.e ...
- 解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
问题截图: 解决方案: 1.打开File --> Setting 窗口 2.搜索 Webpack 3.选择如下路径 问题解决
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- 详解Vue中的computed和watch
作者:小土豆 博客园:https://www.cnblogs.com/HouJiao/ 掘金:https://juejin.cn/user/2436173500265335 1. 前言 作为一名Vue ...
- 详解Vue.js 技术
本文主要从8个章节详解vue技术揭秘,小编觉得挺有用的,分享给大家. 为了把 Vue.js 的源码讲明白,课程设计成由浅入深,分为核心.编译.扩展.生态四个方面去讲,并拆成了八个章节,如下: 准备工作 ...
- 详解vue的数据binding原理
自从angular火了以后,各种mv*框架喷涌而出,angular虽然比较火,但是他的坑还是蛮多的,还有许多性能问题被人们吐槽.比如坑爹的脏检查机制,数据binding是受人喜爱的,脏检查就有点…性能 ...
- vue cli 打包项目造成css背景图路径错误
vue cli做项目的时候难免会碰到,css引用背景图或者css,js之间的相互引用!!!这时候打包后可能会出现一个错误!!如下图: 写法: 错误: 会无端多出一个“/css/static/” 这样就 ...
- 详解Vue 方法与事件处理器
本篇文章主要介绍了详解Vue 方法与事件处理器 ,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 方法与事件处理器 方法处理器 可以用 v-on 指令监听 DOM 事件 ...
随机推荐
- kaptcha验证码插件使用与参数
kaptcha使用1 kaptcha使用2 kaptcha使用3 kaptcha参数说明
- 哈希值、HashSet、LinkedHashSet
一.哈希值 1. 哈希值其实就是一个int数字,我们可以把哈希值看成对象的一个标识,Object中的hashCode方法,可以获取到对象的哈希值 2. Object中的hashCode方法是根据地址值 ...
- ant通配符
ANT通配符有三种: 通配符 说明 ? 匹配任何单字符 * 匹配0或者任意数量的字符 ** 匹配0或者更多的目录 例子: URL路径 说明 /app/*.x 匹配(Matches)所有在app路径下的 ...
- 18-11-01 pandas 学习03
[python]pandas display选项 import pandas as pd 1.pd.set_option('expand_frame_repr', False) True就是可以换行显 ...
- DAX创建带有过滤器的超链接
在这篇文章中,我们将创建一个DAX公式,根据报表中的过滤器生成超链接. 该度量包含2个部分,第一部分是使用DAX生成目标报告的正确URL,第二部分是将过滤器传递给该报告. 浏览器支持的MAX网址长度定 ...
- 如何用Caffe训练自己的网络-探索与试验
现在一直都是用Caffe在跑别人写好的网络,如何运行自定义的网络和图片,是接下来要学习的一点. 1. 使用Caffe中自带的网络模型来运行自己的数据集 参考 [1] :http://www.cnblo ...
- 条件分支语句(SWICH语句)
语法 swich(条件表达式){ Case 表达式: 语句……. Break; Case 表达式: 语句……. Break; Case 表达式: 语句……. Break; default: 语句……. ...
- Python:从入门到实践--第十章--文件和异常--练习
#.python学习笔记:在文本编辑器中新创建一个文件,写几句话老总结你至此学到的python知识 #其中‘In Python you can’ 打头.将这个文件命名为learning_python. ...
- matlab数学实验--第二章
控制流: 分支语句: if (条件式),语句:end if (条件式1),语句1:elseif (条件式2),语句2:……:else,语句:end iwitch(分支变量) case(值1),语句1: ...
- c# .net 面试总结
一. sql优化 . 写明查询具体某几列,减少*的使用,表名过长时,尽量使用表的别名 *和列名一样 ,在业务密集的SQL当中尽量不采用IN操作符,用EXISTS 方案代替. in 和 exists的区 ...