使用Vue搭建项目

1,747 阅读2分钟

一、安装 Node.js

1、首先需要Node.js版本是 10 以上。
2、运行 node -v 查看版本,如果不是 10以上,请先卸载当前版本:进入控制面板点击卸载即可。再安装新版本。

二、安装 @vue/cli

yarn global add @vue/cli
vue --version 查看版本号

三、搭建项目

确保安装好后,找个安全的目录,运行vue create 要新建的文件夹
有点慢,接着它会出现以下让你选择,选择下面那个☞手动选择功能。 (如果键盘无法下移选中它,那么就换一个终端)

回车之后会有一串列表出现,问你想选择哪些特性,上下移动,按空格选中以下: 除了最后一个,其他都要。

继续:
是否使用class样式的组件语法?是
是否把babel和ts一起用?是
是否使用history模式?不(因为它还需要你后台做好一些配置)
用哪一种css预处理器?选择默认第一个dart-sass
使用哪种Linter?默认第一个
什么时候给你提示代码的错误?第二个
用什么测试?Jest
配置放在哪里?默认第一个
是否保存当前所有选项,以供以后所有项目的使用?如果你认为当下选的配置比较全,可选Y,若以后想更改,选N。

回车以后它就会自动下载依赖,等一会就好了。

出现success就是成功,出现报错不用管,出现error就是失败,找出原因再重新来过! 我曾经出现过一次error(因为我使用的是yarn) 解决方法:
1、先看c盘,C:User/.vuerc 找到里面.vuerc文件,打开修改里面的packageManager为yarn。
2、修改yarn源

// 查看 yarn 配置
yarn config get registry
> registry: 'https://registry.yarnpkg.com'

//替换成淘宝镜像
yarn config set registry https://registry.npm.taobao.org

重新再配置vue,成功!

按它的提示,进入文件夹,注意之后最好用编辑器打开serve
当你打开了serve看见以下这个窗口,就证明你的项目创建成功了。