赞
踩
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
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。