vue脚手架构建项目

1.概念:

vue-cli是官方的一个脚手架工具,所谓脚手架呢就是一个架子,什么架子呢?项目结构的架子,里面有一些最基本的结构配置。利用vue-cli呢,我们可以生成这样的一个脚手架,所以呢它就被称为vue脚手架工具。

2.基本使用:

2.1.vue脚手架的使用前提:........。

2.2.vue脚手架使用:

(1)在需要创建项目的文件夹位置打开powershell,或者在导航栏输入cmd进行回车,进到命令行页面。

(2)输入命令:vue init webpack 创建的项目名称。

(3)顺利的话,会出现一些模块的下载让你进行确认,如果不知道怎么进行选择,那就全部进行下载,也就是输入y,然后回车,直到没有提示。

(4)整个项目构建成功。

(5)在使用当前命令可能会因为网络,或者其它的一些原因,而导致模板下载失败,比如。

(6)这种情况下,我一般选择继续下载,也就是继续输入当前命令干,不服就干;不过还可以使用另外一个命令进行项目的构建。也是在当前命令窗口,输入:vue ui

(7)当然,也分两种情况,顺利及不顺利,所以尽量乞求你的电脑所有的配置都能匹配的上吧。以下是顺利的情况。

(8)当出现一下的日志时,会在浏览器弹出vue的项目构建页面。

(9)进行项目的创建,输入我们的项目名称。

(10)点击下一步,进行预设,在这选择手动配置项目。

(11)继续下一步,进入到功能选择,除了自带的默认设置,把Roter和Vuex选上。

(12)紧接着,再进行下一步,进入到最终环节,配置,把里面的使用历史路由勾上,以及选择标准配置。

(13)点击创建项目,会出现让你选择保存预设项目,可以选择不保存,进行创建。

(14)接着,是出现不顺利的情况,我第一次安装时,使用的是powershell,在输入命令之后,提示禁止运行脚本,这种情况下,可以使用cmd命令窗口进行命令输入;或者通过powershell去解除Execution_Policies(运行策略)的限制。

(15)输入get-ExecutionPolicy 查看当前策略,一般默认策略:Restricted(限制脚本运行);然后输入 set-ExecutionPolicy RemoteSigned ,即将策略设置为RemoteSigned (远程签名),然后选择 Y(确定)即可;

(16)输入get-ExecutionPolicy -List 查看当前所有Scope的ExecutionPolicy;与画红线部分一致,则更改成功。接着继续输入命令开搞:vue ui。

(17)还有一种情况是,输入vue ui,cmd以及powershell都没反应。

(18)一般的原因应该是,在Commands:下面你没有 ui [options],可以用 vue-h 查看你的有没有。

(19)可以发现,的确没有ui [options];执行命令 :cnpm i -g @vue/cli进行安装,安装成功后,就可以继续开搞了。

  • 26
    点赞
  • 22
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值