【项目】UniApp实战多端企业网盘全栈开发 29 创建vuecli4项目

阳光穿透心脏的1/2处 2024-03-22 16:02 42阅读 0赞

### 【项目】UniApp实战多端企业网盘全栈开发 ###

#### 文章目录 ####

*   *  【项目】UniApp实战多端企业网盘全栈开发
     *   *   *  29 创建vuecli4项目

![在这里插入图片描述][7715c65e5bd64123aab26a09cb3ac500.png_pic_center]

##### 29 创建vuecli4项目 #####

> 这里笔者用的vuecli 5

这下我们要做PC 端了，移动端页面一直大致开发完毕

![在这里插入图片描述][8ef61ee8e7fb4e388c4087b5987a3250.png_pic_center]

之后的事情就要等到前后端交互的时候再做调整了

首先是安装node

> 哇，老师的版本是12.16.1

![在这里插入图片描述][313b64058da34d97a798d04d70bd0c3e.png_pic_center]

笔者就不降了，应该是向下兼容的【老师的视频比较老了】，出了问题再说吧

安装vuecli 最新版本

这个我好像装过

![在这里插入图片描述][8d7dcb1b2cea493b9b6517c134fdd16e.png_pic_center]

OK，老师用的4.2.3 ，我也不降了

> 卸载命令 `npm uninstall @vue/cli -g`

创建并启动项目 `vue create clouddisk`

![在这里插入图片描述][069eaad88105439caa4a83fc7565a96f.png_pic_center]

![在这里插入图片描述][a667c7b2180d467bb92eefcc28849e9a.png_pic_center]

额，选V2  
![在这里插入图片描述][ef83c89d8df8481fbf58406dbdffc3ac.png_pic_center]

等待创建完成

![在这里插入图片描述][bd683367f6984eac9e0d7432ae13994c.png_pic_center]

OK了

用HBX打开创建出来的项目

![在这里插入图片描述][d56f80151e5f434b8cfdad7f169c27d0.png_pic_center]

![在这里插入图片描述][0e3cde7c73034b86bf54a079b9d5a0d3.png_pic_center]

关闭eslint

![在这里插入图片描述][045cc65f67bf412d89e5842e8550dc95.png_pic_center]

启动项目试试

`npm run serve`

![在这里插入图片描述][32c64a6882374e96acfbd5ef63e2c316.png_pic_center]

![在这里插入图片描述][1169c63543064e0eac9ce71947d8a0dc.png_pic_center]

OK，启动成功，访问一下，本地8080 端口

![在这里插入图片描述][d38e275e3f52454996517e80d2f87496.png_pic_center]

没问题。

[7715c65e5bd64123aab26a09cb3ac500.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/1375e1bf2e87460dac5fda7242378232.png
[8ef61ee8e7fb4e388c4087b5987a3250.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/bde832b5f3774cff9242438992b52543.png
[313b64058da34d97a798d04d70bd0c3e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/b42ff61f629f492ba719ae090a0fefce.png
[8d7dcb1b2cea493b9b6517c134fdd16e.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/a7b3dfcf332147619cbc695372c2e1d5.png
[069eaad88105439caa4a83fc7565a96f.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/501de0dfecf14a44baac46980c81fc24.png
[a667c7b2180d467bb92eefcc28849e9a.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/e65b2276703240a3ae7b5a16be83a897.png
[ef83c89d8df8481fbf58406dbdffc3ac.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/30316c7a846747bba802e2110830abce.png
[bd683367f6984eac9e0d7432ae13994c.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/d457473ee254473faf6ad4130093883f.png
[d56f80151e5f434b8cfdad7f169c27d0.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/4dc210ba4bf842dbbd82d59730c6c217.png
[0e3cde7c73034b86bf54a079b9d5a0d3.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/a6bde45e7a8447319878ce251184ecb2.png
[045cc65f67bf412d89e5842e8550dc95.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/47c9f21c20b14ab693a512f7b8f4e425.png
[32c64a6882374e96acfbd5ef63e2c316.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/13e8f2e99db345cea0893a9775d2b6b4.png
[1169c63543064e0eac9ce71947d8a0dc.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/52bd714c680a4199b9e6b26bd7551a21.png
[d38e275e3f52454996517e80d2f87496.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/22/8c56d9b2d20e41279fa3be36c874b288.png