vue-cil创建vue项目

第一步:检查一下电脑是否安装了vue以及vue-cli

用vue -V检查版本,如果出现“vue” 不是内部或外部命令,也不是可运行的程序或批处理文件,就说明你电脑没有安装vue

 没安装的就需要安装再进行下一步了:详细看官网怎么安装,下面放的链接

安装 | Vue CLI (vuejs.org)

第二步:新建一个文件夹用于建立项目

 第三步:输入创建项目的命令,vue  create  name,这个name是项目名称,注意name必须是英文。

 Default是默认选择(vue2,vue3),Manually select features 是自己手动选择,可以选择你需要的。通常都是自己手动选择,键盘上下键选择,enter确定。

确定后会出来很多选项。当然我的英语也是非常烂的,借助翻译给大家看一下。

1 TypeScript
是否使用class风格的组件语法:Use class-style component syntax?
是否使用babel做转义:Use Babel alongside TypeScript for auto-detected polyfills?

2. Router 路由管理器
路由使用历史模式:Use history mode for router? (Requires proper server setup for index fallback in production) 

3. CSS Pre-processors css预处理
选择CSS 预处理类型:Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default)  
选项:
	Less
	Sass
	Stylus
	
4. Linter / Formatter 代码风格、格式校验
选择Linter / Formatter类型:Pick a linter / formatter config:
选项:
	TSLint
	ESLint with error prevention only  仅错误预防
	ESLint + Airbnb config  Airbnb配置
	ESLint + Standard config 标准配置
	ESLint + Prettier
选择lint方式:Pick additional lint features
选项:
	Lint on save 保存时检查
    Lint and fix on commit 提交时检查
    
 5. Unit Testing 单元测试
选择unit testing类型:Pick a unit testing solution: (Use arrow keys)
选项:
	Mocha + Chai  
    Jest 
    
6. E2E Testing E2E(End To End)即端对端测试
选择E2E testing类型:Pick a E2E testing solution: (Use arrow keys)
选项:
	Cypress (Chrome only) 
    Nightwatch (Selenium-based)
    
7. 选择 Babel, PostCSS, ESLint 等自定义配置的存放位置
 Where do you prefer placing config for Babel, PostCSS, ESLint, etc.?
 选项:
	In dedicated config files 在专用的配置文件中
    In package.json 在package.json
    
8. 将此作为将来项目的预置吗?
 Save this as a preset for future projects?
 选项:
	In dedicated config files 在专用的配置文件中
    In package.json 在package.json
    
9.保存预设为模板
Save preset as:

选择自己需要的以后,按下回车再次选择自己需要的。(我选的2)

 像这种要选择yes还是no的一般情况下都是选择no,可以避免下次写特殊项目不好配置。

 上一步选择no以后,会让你选着CSS 预处理语言。选择你会用的。

再然后也是一些选项,按照翻译选择自己需要的,我这里选的倒数第二个。

 选择第一个。

 选择第二个。下图是选择后的图。再输入n,就开始创建项目啦

创建项目的过程会有一段时间。

 

 创建完成后会有一个进入项目,和运行项目的命令提示。

 坐等运行就可以啦。

如果报错,请看下一篇文章!!!!!!!!!

猜你喜欢

转载自blog.csdn.net/H524268015wsw/article/details/127918130
今日推荐