Vue 搭建脚手架全过程

前期的学习,使用Vue可以直接引入官方的cdn来进行学习,后期做项目之后我们就必须要自己搭建脚手架来了,

脚手架搭建流程

1.下载一下Node.js,下载链接https://nodejs.org/zh-cn/

2.下载好之后直接安装即可

3.在终端测试一下是否安装成功

–3.1 windows电脑 打开命令行(快捷键win + R) 输入 cmd

–3.2 在命令行中输入 node -v 会显示nodejs的版本,显示版本就是安装成功 确认一下版本号在6.9以上

–3.3 继续在命令行中输入 npm -v 也可以看到版本号 看一下版本在3.10以上即可

4. 正式安装脚手架

–4.1 在命令行工具中 第一步安装全局的vue-cli

输入 npm install –global vue-cli(我这里用的国内的镜像 是cnpm 效果是一样的)

等待一会让他安装,成功之后我们可以测试一下

输入 vue –version 也会自动显示一个版本号,有版本号就说明安装成功了

–4.2 确认好之后,我们就可以通过命令行切换到自己要安装的位置

比如我这里是在 E:JavaScript-VueVuecli 这里

在命令行中切换到这个路径即可

切换到这个文件夹之后,就可以进行下一步操作

输入 vue init webpack XXX(这里XXX是你自己创建的文件夹名称),

比如我的叫bilibili-vue 那么就输入 vue init webpack bilibili-vue

这个时候稍微等一下,会自己下载模板,好了之后我们进行一些配置

Project name(bilibili-vue) 这是我自己创建的文件名称 如果默认就直接回车键 如果想改的话就重新输入一个名字

这里我就默认了 回车键

下面一直回车键 到显示 Runtime+Compiler这里还是按下回车键

之后的一系列选择全部选择 n(No)就可以

然后会出现三个选项,选择最后一个myself 那个自己配置就OK了

然后命令行会提示你可以cd 到你的新建的文件夹了,于是我这里写了 cd bilibili-vue 注意别写错啦

然后就剩下最后一步了输入 npm install(我这里用的是cnpm效果一样的没有影响的),然后等待安装好就OK了

到这里就全部大公告成了,大家可以打开自己的文件下看下,已经多了一个新创建的文件了,可以在VSCode或者其他编译器打开做Vue项目啦!

原文链接:https://blog.csdn.net/qq_41671005/article/details/106238721?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522165934461816782390556177%2522%252C%2522scm%2522%253A%252220140713.130102334.pc%255Fblog.%2522%257D&request_id=165934461816782390556177&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~blog~first_rank_ecpm_v1~times_rank-13-106238721-null-null.nonecase&utm_term=%E6%90%AD%E5%BB%BAcdn

原创文章,作者:优速盾-小U,如若转载,请注明出处:https://www.cdnb.net/bbs/archives/7429

(0)
上一篇 2022年10月2日
下一篇 2022年10月2日

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

优速盾注册领取大礼包www.cdnb.net
/sitemap.xml