VueCLI4.0最新版安装教程
关于旧版本
Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。
注意点:Vue CLI 需要 Node.js 8.9 或更⾼版本 (推荐 8.11.0+)。
1.你可以使⽤下列任⼀命令安装这个新的包:
npm install -g @vue/cli
或者
yarn global add @vue/cli
⼆者选⼀
2.你还可以⽤这个命令来检查是否安装成功及其安装版本:
vue --version
vue element admin3.创建项⽬
vue create 项⽬名称
4.选择
然后你会被提⽰选取⼀个 preset。你可以选默认的包含了基本的 Babel + ESLint 设置的 preset,也可以选“⼿动选择特性”来选取需要的特性。
这个默认的设置⾮常适合快速创建⼀个新项⽬的原型,⽽⼿动设置则提供了更多的选项
5.若选择⼿动请继续以下操作
选择预设配置为router、vuex、babel、eslint
注意,上下⽅向键时控制上下移动的,空格键是选择对应项的
在这⾥插⼊图⽚描述
6.是否使⽤路由的history模式,看个⼈及项⽬
hash —— 即地址栏 URL 中的 # 符号
⽐如这个 URL:www.abc/#/hello,hash 的值为 #/hello。它的特点在于:hash 虽然出现在 URL 中,但不会被包括在HTTP 请求中,对后端完全没有影响,因此改变 hash 不会重新加载页⾯。
history模式需要后端配合使⽤
7.选择⼀个预处理语⾔
发现scss是element-admin框架的依赖css预处理语⾔,就选择sass吧,选择node-sass
8.语法检测⼯具
分别为,只预防、airbnb配置、标注配置、最⾼配置
9.选择代码检测的时机
10.更新换将单独配置的⽂件放到pakage.json还是放在单独的⽂件
11.是否把以上设置过的预设配置保存起来
这⾥不需要,每次创建项⽬重新选择⼀遍不⿇烦,很快就选择好了,输⼊n
回车,就开始创建项⽬了,耐⼼等待,安装依赖
cd 你开始设置的项⽬名
然后启动项⽬即可完成
12.使⽤图形化界⾯
你也可以通过 vue ui 命令以图形化界⾯创建和管理项⽬:
上述命令会打开⼀个浏览器窗⼝,并以图形化界⾯将你引导⾄项⽬创建的流程。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论