Vue项目搭建

使用Vue CLi 创建项目

如果你还没有安装VueCLI,请执行下面的命令安装或升级

npm install --global @vue/cli

在命令行中输入以下命令创建Vue项目：

vue create "项目名称"

Vue CLI v4.5.13
?  Please pick a preset: (Use arrow keys)
  Default ([Vue 2] babel, eslint)
  Default (Vue 3) ([Vue 3] babel, eslint)
> Manually select features

 default:默认勾选babel、eslint,回车之后直接进入装包

manually:自定义勾选特性配置，选择完毕之后，才会进入装包

选择第3种：手动选择特性，支持更多自定义选项

Vue CLI v4.5.13
? Please pick a preset: Manually select features
? Check the features needed for your project: (Press <space> to select, <a> to toggle all? Check the features needed for your project:
 (*) Choose Vue version
 (*) Babel
 ( ) TypeScript
 ( ) Progressive Web App (PWA) Support
 (*) Router
 (*) Vuex
>(*) CSS Pre-processors
 (*) Linter / Formatter
 ( ) Unit Testing
 ( ) E2E Testing

分别选择：

• Babel: es6 转 es5
• Router:路由
• Vuex:数据容器，存储共享数据
• CSS Pre-processors:CSS预处理器，后面会提示你选择less、scss/sass、stylus等
• Linter/Formatter:代码格式校验

S Pre-processors, Linter
? Choose a version of Vue.js that you want to start the project with (Use arrow keys)
> 2.x
  3.x

选择要启动项目的Vue.js版本

? Use history mode for router? (Requires proper server setup for index fallback in produc

tion) (Y/n) n

 是否使用history 路由模式，这种模式兼容性不好，所以这里输入no （不使用）

? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by defaul

t): (Use arrow keys)
  Sass/SCSS (with dart-sass)
> Sass/SCSS (with node-sass)
  Less
  Stylus

 选择一个CSS预处理器

? Pick a linter / formatter config: (Use arrow keys)
  ESLint with error prevention only
  ESLint + Airbnb config
> ESLint + Standard config
  ESLint + Prettier

选择一个linter/formatter配置

? Pick additional lint features:
 (*) Lint on save
>(*) Lint and fix on commit

 选择其他lint功能

? Where do you prefer placing config for Babel, ESLint, etc.? (Use arrow keys)
> In dedicated config files
  In package.json

 您喜欢在哪里放置Babel、ESLint等的配置，一般选择单独放到一个文件里，比较好管理

? Save this as a preset for future projects? (y/N) n

 是否将此保存为将来项目的预设，这里建议不要保存，下次创建项目时重新选择~

下面就开始装包了

over,到此整个项目就已经搭建好啦~~~~