vue搭建的两种方式

vue搭建的两种方式

脚手架创建

cmd 输入 vue ui

本命令要求vue3.0的版本，如果版本过低需要卸载重新安装

npm uninstall vue-cli -g 卸载

npm install -g @vue/cli 安装

输入命令后会出现下面的回复

如果没有在浏览器上自动打开，可以在浏览器上手动访问地址，出现下面的界面。

我们可以通过红线处的图标，来到下图位置

点击create新建项目

我们可以通过红线处来修改项目的地址，也可在路线处直接新建项目，总之是要选择合适的位置。

接着我们会看到下面的界面，填写我们的项目名称，选择填写成下列的形式

在下一页中我们选择Manual(手动配置)，点击 Next

在本页中，我们必须要选择 Bable,Router,Linter/Formatter,使用配置文件这几项

这一页里面我们选择为 ESLint+Standard config，即标准配置文件，vue的版本选择因需求而定。

绿色的线表示不保留本次的配置选择，橘色的表示保留，以便下一次可以直接使用（即不需要上面的Mannual，而是选择之前的预设）

之后我们就可以耐心的等待项目创建成功啦~

创建完成之后，我们可以通过点击下方Plugins 来添加插件这里以element-ui为例

如果已经安装安装的plugin中没有我们需要的，我们点击add plugin

我们通过搜索找到element-ui添加安装即可，耐心等待即可

这样就大致完成了项目的搭建

vue cli 创建

cmd 输入 vue create 项目名称

出现下面回复我们选择 Manually select feature（手动配置）

上下键来转换选项，空格来选中，选中我们需要的配置

此处是来选择vue的版本的，因需求来选择（上一部分没有选择Choose Vue version 不会出现)

此处是路由配置，我们默认n

eslint 选择模式 我们选择 Standard config

eslint 样式的检查 是在save 还是 commit 是，我们选择在 save时

此处是选择配置文件是独立的还是集成到一起的我们选择 In delicated config files

是否保留预设，这里选择N

之后我们便可以等待项目建成了，也就是说插件的引入是要在文件中引入，这种方法不能引入插件