@vue/cli
全局安装
npm i @vue/cli -g
cnpm i @vue/cli -g
npm i @vue/cli -g --registry=https://registry.npm.taobao.org
yarn global add @vue/cli (前提条件是安装yarn : npm i yarn -g)
创建项目
vue create 项目名称
项目相关配置项
- 选择自定义安装 Manually select features
Vue CLI v4.5.11
? Please pick a preset:
first ([Vue 2] babel)
Default ([Vue 2] babel, eslint)
Default (Vue 3 Preview) ([Vue 3] babel, eslint)
> Manually select features
- 选择 安装的插件和包 选中标识的
通过上下箭头选择项目， 通过空格键 取消或选中 （） 代表选中该项目
Vue CLI v4.5.11
? Please pick a preset: Manually select features
? Check the features needed for your project: (Press <space> to select, <a> to t
oggle all, <i> to invert selection)
>(*) Choose Vue version
(*) Babel
( ) TypeScript
( ) Progressive Web App (PWA) Support
( ) Router
( ) Vuex
( ) CSS Pre-processors
( ) Linter / Formatter
( ) Unit Testing
( ) E2E Testing
- 选择vue的版本号
? Choose a version of Vue.js that you want to start the project with (Use arrow
keys)
> 2.x
3.x (Preview)
- 选择babel的配置文件的位置 通常选择单独的配置文件
? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files
- 是否把以上选项保存为预设（下次可以直接使用）
? Save this as a preset for future projects? (y/N)
// 如果输入 y。 需要输入预设名字（自定义）
// 如果输入 n, 不保留
-
等待安装
-
进入项目文件夹
cd myapp
- 启动项目
npm run serve
项目结构
- public
- src
- assets(静态资源)
- components(存放所有的组件， 都是 .vue的文件（单文件组件）)
- App.vue (页面)
- main.js (入口文件)