vue-cli

@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 项目名称

项目相关配置项

1. 选择自定义安装 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

2. 选择 安装的插件和包 选中标识的
   通过上下箭头选择项目， 通过空格键 取消或选中 （） 代表选中该项目

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

3. 选择vue的版本号

? Choose a version of Vue.js that you want to start the project with (Use arrow
keys)
> 2.x
  3.x (Preview)

4. 选择babel的配置文件的位置 通常选择单独的配置文件

? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files

5. 是否把以上选项保存为预设（下次可以直接使用）

? Save this as a preset for future projects? (y/N) 
// 如果输入 y。 需要输入预设名字（自定义）
//  如果输入 n, 不保留

6. 等待安装

7. 进入项目文件夹

cd myapp

8. 启动项目

npm run serve

项目结构

• public
• src
  • assets(静态资源)
  • components(存放所有的组件， 都是 .vue的文件（单文件组件）)
  • App.vue (页面)
  • main.js (入口文件)