Javascript

vue cli3创建项目?

本文主要是介绍vue cli3创建项目?，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

说明：

写作主要的目的是记录自己做过的东西，好记性不如烂笔头，因此做手记录。在帮助自己的同时也希望可以帮助到有需要的人。好了，废话少讲，跟着我直入主题吧！

前提：

安装了 npm 、node.js 、vue cli3 环境。

步骤如下：

1、命令行输入：

vue create 项目名

2、选择 default 创建项目的话一直回车就可以创建好项目。此处我选择的是手动配置项目：Manually select features。

在这里插入图片描述

3、手动配置需要进行如下配置，* 代表选中该配置。

​ space 选择

​ a 全选

​ i 反选
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mBx1tk5H-1634829397982)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021221432154.png)]

4、此处按照项目需要自行选择：
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-GXUByVdx-1634829397985)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021214010272.png)]
选项说明如下：

选项说明
Babel转码
TypeScriptTypeScript
Progressive Web App (PWA) Support支持渐进式Web应用程序（PWA）
Router路由
VuexVuex
CSS Pre-processorscss预处理
Linter / Formatter代码风格检查和格式化
Unit Testing单元测试
E2E TestingE2E测试

5、选择 vue 项目版本，此处可自行选择，我选的是 vue3 的版本。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-McqiM2Sd-1634829397992)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021222623786.png)]
​6、路由是否选择history路由模式,这里输入 n ,默认模式即可,然后回车。
在这里插入图片描述

​7、选择CSS预处理器（自行根据需要选择），这里选择 Less
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-Oi6DkXQd-1634829397996)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021214722675.png)]

​8、自动代码格式检测，选择 ESLint + Standard config 标准版的
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-PpCc1S2n-1634829397997)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021214810717.png)]

9、选择 Lint on save。保存时检测
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-HFa6H3rz-1634829397999)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021225558714.png)]

10、配置文件保存位置： 我选的是保存在 package.json 文件中
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-BU7cZJzT-1634829398001)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021225432927.png)]

11、是否保存项目创建配置，选择 y
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-dON50JAl-1634829398003)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021230153780.png)]

12、下一步直接 回车 就创建好项目了。如下图跑起来就好
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-9O8MhkDo-1634829398005)(C:\Users\HZS\AppData\Roaming\Typora\typora-user-images\image-20211021230614843.png)]

这篇关于vue cli3创建项目?的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航