时间:2021-05-26
什么是vue脚手架?
他是一个快速构建vue项目的工具,通过他,我们可以将vue所需要的文件安装完成。
vue-cli这个构建工具大大降低了webpack的使用难度,支持热更新,有webpack-dev-server的支持,
相当于启动了一个请求服务器,给你搭建了一个测试环境,只关注开发就OK。
安装vue-cli脚手架
安装脚手架需要用cnpm(淘宝镜像)安装,直接用pip安装会失败,安装cnpm命令如下:
npm install cnpm -g --registry=https://registry.npm.taobao.org安装成功输入:cnpm-V,查看cnpm是否安装成功,
注意V一定要是大写.
安装vue脚手架命令去下:
cnpm install -g vue-cli 安装成功是下面这样的
然后使用vue-V查看是否安装成功.
如果安装失败可能是cnpm版本过低,更新cnpm的版本即可.
cnpm更新必须要手动更新,更新命令如下:
npm install -g npm使用vue init webpack myitem这条命令,就可以创建一个vue
的脚手架。
解释一下命令:
vue init 即使用vue-cli初始化一个项目。
webpack 是说使用webpack作为构建工具。
firstvue 是项目名称。 注意: 项目名称推荐使用小写字母。
安装时会暂停一下,你点击Enter进行下一步就可以了,
Install vue-router? 是否安装vue的路由?如果你要做前后端的项目的话,就要选择yes,建议选择yes.
Pick an unit tester jest 是否单元测试
其他的更具自己的需求进行选择
安装成功会显示出这两个命令:
这个时候进入你新建的vue项目的目录下,你会发现他新建了一个mytime的文件夹
在运行项目前,需要安装依赖,命令如下:
cnpm installVue需要在黑窗口启动一下.
启动之前进入vue的项目根目录下.输入命令:
cd mytime 进入根目录
npm run dev 启动项目
启动成功效果如下:
复制路由:http://localhost:8081,在谷歌浏览器打开,会显示页面:
这个时候,一个完整的vue脚手架成功搭建成功.
把你新建的vue项目拖拽到你的编程软件的根目录下:
会出现这些文件,这个时候,你就可以进行编辑了
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了Vue-CLI与Vuex使用方法。分享给大家供大家参考,具体如下:1、通过Vue-CLI创建项目Vue-CLI是Vue用于创建Vue项目的脚手架工
一:使用方法在vue官方脚手架中,即vue-lci搭建的项目中,可以轻易的使用less/sass。先使用npm下载依赖,命令行为'npminstalllessl
本文为大家分享了vue使用echarts图表的方法,供大家参考,具体内容如下该示例使用vue-cli脚手架搭建安装echarts依赖npminstallecha
vue-cli脚手架模板是基于node下的npm来完成安装,下面给大家介绍vue-cli脚手架的安装,具体内容如下所述:https://github.com/v
脚手架脚手架帮我们帮我们把webpack等相关的配置都处理好,我们只需要基于脚手架快速构建一个项目即可(项目中一定包含webpack的相关配置)vue脚手架vu