- 选择一个文件夹,在此路径下打开cmd,输入命令
vue create demo-test
注意:路径中不要包含中文、空格及特殊字符。项目名称必须小写,否侧不能正常创建项目。
-
手动选择Vue版本,这里我习惯选择手动选择功能,这样的好处是可以根据自己的习惯更灵活的创建项目。(方向键上下来回选择,空格选中所选插件,回车键进入下一个选项)
- 选择要用到的插件(多选),这里简单地介绍一下各选项的作用。
- Babel:进行语法降级,确保在旧版浏览器中正常运行;
- TypeScript: JavaScript语言的超集(选择此项的话,项目默认语言会从JS改为TS);
- Progressive Web App (PWA) Support :使网络应用程序更像本机应用程序,具有离线访问、推送通知和可以安装在用户设备上的功能;
- Router:管理导航和路由;
- Vuex:状态管理工具,管理项目中的公共数据;
- CSS Pre-processors: CSS预处理器,允许以更结构化和高效的方式编写CSS,具有变量、嵌套和混合等功能,使样式更易于维护;
- Linter / Formatter : Linter是一个分析代码潜在错误、bug或样式问题的工具。格式化器有助于强制执行编码样式指南,并自动格式化代码以保持一致性;
- Unit Testing : 单元测试涉及在隔离的环境中测试代码的各个单元或组件,以确保它们按预期工作。它有助于早期发现错误并保持代码质量;
- E2E Testing : 端到端测试涉及从开始到结束测试整个应用程序流程,以确保所有组件正确协同工作。它有助于验证应用程序的功能和行为。
4 . 选择Vue版本
5.选择路由模式,有history和hash两种模式,history需要服务器进行额外配置,这里我输入n,意思是不选择history模式。
6.选择CSS预处理器
7.选择ESLint模式
8.选择Lint功能
9.选择配置文件,一般选择package.json就行
10.不要固定此次设置,输入N
这样,我们的项目就创建好了,现在输入以下代码,项目就可以跑起来了。你也来创建一个项目试试吧!!
cd project-name
npm run serve(Vue2)或者npm run dev(Vue3)