【vue】vue创建3.x项目

淡淡的烟草味﹌ 2022-09-03 13:12 137阅读 0赞

# vue创建3.x项目 #

转载自：[https://blog.csdn.net/weixin\_49257048/article/details/107436525][https_blog.csdn.net_weixin_49257048_article_details_107436525]  
vue3.x配置帮助：[https://segmentfault.com/a/1190000017008697][https_segmentfault.com_a_1190000017008697]

## 升级vue-cli版本 ##

首先，查看vue-cli版本

vue -V

通过管理员命令打开cmd，升级到最新版

cnpm install -g @vue/cli

## 创建项目 ##

[https://blog.csdn.net/weixin\_49257048/article/details/107436525][https_blog.csdn.net_weixin_49257048_article_details_107436525]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70]

## 启动项目 ##

vscode打开项目，直接运行`npm run dev`，报错 如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 1]  
然后根据提示，运行`npm run`命令，给出了如下命令  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 2]  
有serve，build，lint  
启动项目：npm run serve；  
发布项目：npm run build；  
修复错误的配置：npm run lint。 最后这条是百度的，没使用过。

## 启动项目 ##

npm run serve  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 3]  
可以看到3.x创建的项目，已经帮我们自动配置好了通过ip访问。最近做的一个移动端的页面需要在手机上配置这个，所以有印象，挺好的。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 4]

# 最后 #

sql，加油！

[https_blog.csdn.net_weixin_49257048_article_details_107436525]: https://blog.csdn.net/weixin_49257048/article/details/107436525
[https_segmentfault.com_a_1190000017008697]: https://segmentfault.com/a/1190000017008697
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70]: /images/20220829/7ca441d552c64f56b10ff9ed21f2fb92.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 1]: /images/20220829/75c3e7e190b144148e466719ec162b08.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 2]: /images/20220829/c8fd14eb6b184d909648f6b0b5f38bb0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 3]: /images/20220829/604bc261e9124b94940cedf9aad0f557.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3MxNDQxMTAxMjY1_size_16_color_FFFFFF_t_70 4]: /images/20220829/8c2cbeb6c3824b46b4735e17fc87a999.png