cli生成vue3

1,在命令行输入vue create 项目名称,输入完成后,他会有这样一句询问

Your connection to the default yarn registry seems to be slow.
  Use https://registry.npm.taobao.org for faster installation? (Y/n)

意思是没有科学上网是否选择淘宝源,这里选择y(如果配置过淘宝源则不会显示这个选项)
2.上一步选择y后会弹出如下选项

? Please pick a preset: (Use arrow keys)            //请选择预选项
> Default ([Vue 2] babel, eslint)                   //使用Vue2默认模板进行创建
  Default (Vue 3 Preview) ([Vue 3] babel, eslint)   //使用Vue3默认模板进行创建
  Manually select features      //手动选择配置项

这里我们选择 第三个Manually select features (如果没有上面的选项,说明你的cli需要更新)

3.完成上一步后会出现如下选项

? Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>(*) Choose Vue version
 (*) Babel
 ( ) TypeScript //是否使用typescript
 ( ) Progressive Web App (PWA) Support
 ( ) Router //是否使用vue-router
 ( ) Vuex //是否使用vuex
 ( ) CSS Pre-processors             //CSS预处理器
 (*) Linter / Formatter             //格式化工具
 ( ) Unit Testing                   //单元测试
 ( ) E2E Testing                    //E2E测试

选择你需要的配置,(空格键选择)
4.完成上一步会弹出如下选择,让你选择版本,一般选择3.x

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

5.完成上一步弹出如下选择

 Use history mode for router? // 是否使用history模式的路由
 Use class-style component syntax? (y/N) n // 是否使用class的方式创建组件
Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? (y/N) y //是否需要一些ts基础配置

6.完成上一步出现ESLint的一些配置,这里可以选择第一项默认

? Pick a linter / formatter config: (Use arrow keys)
> ESLint with error prevention only //默认配置
  ESLint + Airbnb config
  ESLint + Standard config
  ESLint + Prettier
  TSLint (deprecated) //校验代码

7.完成上一步弹出增加lint的特性功能

? Pick additional lint features: (Press <space> to select, <a> to toggle all, <i> to invert selection)
>(*) Lint on save         //保存的时候进行Lint
 ( ) Lint and fix on commit   //需要帮你进行fix(修理),这项我们不进行选择

8.完成上一步后让你选择这些配置文件时单独存放,还是直接存放在package.json文件里,可以默认第一项

In dedicated config files
In package.json

9.最后一项询问是否保存本次配置,下次直接进行使用,这里选择不保存

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

回车后生成项目出现下面信息说明安装成功


 $ cd test3
 $ npm run serve

猜你喜欢

转载自blog.csdn.net/weixin_42215897/article/details/115347082