【技术研究】springboot+vue爬坑指南-2020.5.13

r囧r小猫 2023-03-13 11:56 129阅读 0赞

最真实的技术研究记录全过程

B站看了下vue教程，两倍速+拖动快速预览后，发现基本环境在之前测试小程序开发流程时已经安装完毕了，于是找了一篇介绍springboot+vue框架搭建的博客（[Springboot Vue Login(从零开始实现Springboot+Vue登录)][Springboot Vue Login_Springboot_Vue]）

浏览了一下之后，下载了vue和springboot的代码。

运行vscode，加载vue代码，运行的时候报错

vue-cli-service' 不是内部或外部命令，也不是可运行的程序或批处理文件

查了一下原因，下载的项目需要在本地npm环境中重新install。cmd命令行模式进行项目文件夹，输入npm install，然后开始执行，继续报错。

Module build failed (from ./node_modules/sass-loader/lib/loader.js):
    Error: Cannot find module 'node-sass'

在npm下安装一个淘宝镜像npm install -g cnpm --registry=https://registry.npm.taobao.org

然后用cnpm下载最新的node-sass，代码cnpm install node-sass@latest  
，重新在vscode中，terminal-run task。成功弹出登录页面

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZXhpaXBob25l_size_16_color_FFFFFF_t_70]

vue项目运行成功，下面开始运行springboot项目。

还是之前的博客，博主很好心的后面有git链接，直接下载，然后idea加载。第一次会有些慢，需要导入maven相关依赖。  
![在这里插入图片描述][20200513160401851.png]

发现pom.xml报错。

Project 'org.springframework.boot:spring-boot-starter-parent:2.2.2.RELEASE' not found

多次执行maven install后，该pom文件的依赖始终无法下载。

于是在pom文件中，增加阿里的代理信息

<repositories>
    		<repository>
    			<id>aliyunmaven</id>
    			<url>http://maven.aliyun.com/nexus/content/groups/public/</url>
    		</repository>
    	</repositories>

再次运行maven install，发现原有的2.2.5.RELEASE已经从红色变为黑色。

然后继续报错

Plugin org.springframework.boot:spring-boot-maven-plugin:2.2.5.RELEASE or one of its dependencies could not be resolved: Failed to read artifact descriptor for org.springframework.boot:spring-boot-maven-plugin:jar:2.2.5.RELEASE: Could not transfer artifact org.springframework.boot:spring-boot-maven-plugin:pom:2.2.5.RELEASE from/to central (http://repo.maven.apache.org/maven2): Failed to transfer file: http://repo.maven.apache.org/maven2/org/springframework/boot/spring-boot-maven-plugin/2.2.5.RELEASE/spring-boot-maven-plugin-2.2.5.RELEASE.pom. Return code is: 501 , ReasonPhrase:HTTPS Required. -> [Help 1]

在maven的.m2文件夹下找到setting.xml，然后把下面的话复制进去。

<?xml version="1.0" encoding="UTF-8"?>
    <settings xmlns="http://maven.apache.org/SETTINGS/1.0.0"
              xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
              xsi:schemaLocation="http://maven.apache.org/SETTINGS/1.0.0 http://maven.apache.org/xsd/settings-1.0.0.xsd">
    	<mirrors>
    		<mirror>
    		  <id>mirrorId</id>
    		  <mirrorOf>central</mirrorOf>
    		  <name>Human Readable Name for this Mirror.</name>
    		  <url>http://maven.aliyun.com/nexus/content/groups/public</url>
    		</mirror>
    	</mirrors>　
    </settings>

使用阿里云的代理下载pom文件。问题解决。  
![在这里插入图片描述][2020051416011128.png]

真是不容易，第一个springBoot+vue的例子，终于跑起来了。

[Springboot Vue Login_Springboot_Vue]: https://blog.csdn.net/xiaojinlai123/article/details/90694372
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3h1ZXhpaXBob25l_size_16_color_FFFFFF_t_70]: /images/20230312/8c68819eba9149eba598abfe031e4c43.png
[20200513160401851.png]: /images/20230312/4e5ad4c6875b4da38328765d67043729.png
[2020051416011128.png]: https://img-blog.csdnimg.cn/2020051416011128.png