1.开发环境 vue+webpack
2.电脑系统 windows10专业版
3.在开发的过程中,咱们常常会应用到webpack,上面我来分享一下如何应用vue+webpack创立我的项目。
4.在终端输出:
vue init webpack chen //管理员身份,// chen 示意你要创立我的项目的名称,不能是大写
5.抉择解释:
一.Project name :项目名称,如果不须要就间接回车二:Project description:我的项目形容三:Author: 作者四:Vue build :构建形式 1.Runtime+Compiler:recommended for most users : 解释:运行+编译:被举荐给大多数用户 2.allowed in vue files-render functions are required elsewhere:(解释:只容许大概6kb比轻量的压缩文件,但只容许模板(或任何vue特定html)vue文件须要在其余中央出现函数。大略意思是抉择该构建形式对文件大小有要求。 ///在这里举荐应用1,适宜发少数用户五:install vue-router?是否装置vue的路由插件,须要就抉择y六:Use ESLint to lint your code?是否应用ESLint检测你的代码七:Pick an ESLint preset:抉择分支格调 1.standard(https://github.com/feross/standard) js的规范格调 2.Airbnb(https://github.com/airbnb/javascript) JavaScript最正当的办法,这个github地址说是JavaScript最正当的办法 3.none (configure it yourself) 本人配置
6.配置文件剖析:
{ //这个代码块里的都是我的项目形容,是创建者自定义的 "name": "qqmusic", //项目名称 "version": "1.0.0", //我的项目版本 "description": "qq music app by vue", //我的项目形容 "author": "author", //我的项目作者 "private": true, //是否为公有 "scripts": { //这里是命名一些变量对应什么指令 "dev": "node build/dev-server.js", //运行dev 相当于运行node build/dev-server.js "start": "node build/dev-server.js", //同上 "build": "node build/build.js", //同上 "lint": "eslint --ext .js,.vue src" //同上 }, "dependencies": { //这个代码块形容此 我的项目依赖 的插件;上面两个做什么的自行搜寻 "vue": "^2.2.6", "vue-router": "^2.3.1" }, "devDependencies": { //这个代码块里形容的是此我的项目 运行依赖 插件;留神根下面我的项目依赖的辨别 "autoprefixer": "^6.7.2", //这英文翻译过去就是:主动 预 修复者,业余称说晓得的能够回复下;它是一个css前缀解决工具,有了它咱们就不必写很多前缀了 ... }, "engines": { // 引擎相干的内容 "node": ">= 4.0.0", //要求node版本要大于指定版本,否则不给你运行~ "npm": ">= 3.0.0" //要求npm版本大于指定版本 }, "browserslist": [ // 配置浏览器的信息查问范畴,这些信息将给Autoprefixer babel-env-preset eslint-plugin-compat这些组件来应用 https://www.npmjs.com/package/browserslist "> 1%", // "last 2 versions", //每种浏览器的最近的两个版本 "not ie <= 8" //IE8及以下版本不查问 ]}
7.本期的分享到了这里就完结啦,心愿对你有所帮忙,让咱们一起致力走向巅峰。