Vue-cli前端工程配置

全局安装Vue-cli工具

在任意目录打开任意命令行终端(cmd，powershell，vscode内置等)

npm install -g @vue/cli
# OR
yarn global add @vue/cli
1
2
3

注意，要使用yarn安装vue-cli的话，需要先执行npm i yarn -g安装yarn。

验证安装

vue --version
1

创建工程骨架

创建项目

cd到要创建项目的目录，执行以下命令

vue create 项目名称
1

选择项目模板

1. create项目后，出现项目模板选择界面，用↑↓键操作，Default ([Vue 3] babel, eslint)是vue3的官方标准模板，包含vue3，babel和eslint，Default ([Vue 2] babel, eslint)是vue2的官方标准模板，包含vue2，babel和eslint，Manually select features是手动自定义，一般都选手动自定义，选中手动自定义，回车确认。
   
2. 选择需要的包，操作是：↑↓键切换选项，空格切换选中与不选中，回车确认并进入下一步。只选了babel
3. 选择vue版本，有3.X和2.X，仍然是↑↓键切换选项，回车确认并进入下一步，这个按需要选择，本文选择2.X。
4. 选择包配置的管理文件，In dedicated config files是vue默认的配置管理文件，In package.json是npm项目默认的配置管理文件，选择In dedicated config files，回车确认并进入下一步
5. 选择是否保存当前的模板配置，输入y就保存，需要输入一个模板名称来保存这次的配置，输入N就退出，这个选项按需要决定。

试运行

cd 项目名称
npm run serve
1
2