Vuecli前端工程配置

全局安装Vue-cli工具

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

npm install -g &＃64;vue/cli
# OR
yarn global add &＃64;vue/cli


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

验证安装

vue --version


创建工程骨架

创建项目

cd到要创建项目的目录&＃xff0c;执行以下命令

vue create 项目名称


选择项目模板

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

试运行

cd 项目名称
npm run serve