安装vue-cli
cnpm i -g @vue/cli
创建vue3.0项目
vue create 项目名
//选择安装的模板
?Please pick a preset: (Use arrow keys)
Manually select features √
//选择需要使用的工具
? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>(*) Choose Vue version --选择vue版本
(*) Babel
(*) TypeScript
( ) Progressive Web App (PWA) Support --PWA 支持
(*) Router
(*) Vuex
(*) CSS Pre-processors --css预处理器
(*) Linter / Formatter --支持代码风格检查和格式化。
( ) Unit Testing --支持单元测试。
( ) E2E Testing --支持 E2E 测试。
//选择vue版本
? Choose a version of Vue.js that you want to start the project with
2.x
> 3.x (Preview)
//是否使用class-style类型语法
? Use class-style component syntax? (y/N) y
//是否使用babel和typescript编译我们的jsx
? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? (Y/n) Y
//路由是否使用history
Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n) n
//选择css预处理器
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): (Use arrow keys)
> Sass/SCSS (with dart-sass)
Sass/SCSS (with node-sass)
Less
Stylus
//选择eslint检测规则
? Pick a linter / formatter config: (Use arrow keys)
ESLint with error prevention only
ESLint + Airbnb config
ESLint + Standard config
> ESLint + Prettier
TSLint (deprecated)
//何时检测
? Pick additional lint features: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>(*) Lint on save --保存时检测
( ) Lint and fix on commit --fix和commit时候检查
//abel,postcss,eslint,etc这些配置文件存储位置
? Where do you prefer placing config for Babel, ESLint, etc.? (Use arrow keys)
> In dedicated config files //独立文件
In package.json //统一存放package.json
//是否保存为默认模板，利于下次直接使用
Save this as a preset for future projects? (y/N)
