Vue项目打包

根据以往的经验，只需要修改一下output的publicpath即可。我也是先做的这一步

把原先的地址注释或者删了。就可以打包了。
而当我运行 npm run build 的时候给我报了十几个node的警告。我一看反正不是error。一点不慌。结果嘛。呵呵。springboot一启动就报错。问了度娘。答案惊人的一致。node.js版本太高。降个级就好了。可我觉得这不应该是解决方法的正确做法。就继续百度。终于看到一篇不太一样的。让下载stylu。然后在index.js里面配置一下。试了。没用，这里就不粘图了。最终老老实实降级。问题解决。
降级的时候也很简单。因为之前就是下的免安装版本。只要在cmd里面敲 ** where node** 。就能找到文件位置。然后嘛，删呗。再去官网下个12的版本。环境变量里面把NODE_HOME的地址改成新的就可以了。友情提示一下。记得先把打开的cmd关了重新开。再验证是否安装成功。

加一个小知识，Vue打包之前还要配置一点东西，不然elementui的图标可能会无法加载

这样在打包前端的东西就都在dist里面了。

springboot配置。

先把dist文件夹的东西复制到springboot。

resources下如果没有static 和templates 就先创建文件夹。
当然，springboot是不允许直接访问templates文件夹下的文件的。那么就借助thymeleaf
先引入一个依赖

        <!-- 访问template下的html文件 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

        <!-- 启用不严格检查html -->
        <dependency>
            <groupId>net.sourceforge.nekohtml</groupId>
            <artifactId>nekohtml</artifactId>
            <version>1.9.22</version>
        </dependency>

下面这个也可以用起来。就像注释说的那样。不严格检查。

再在yaml文件里面配置一下。

  mvc:
    resources:
      static-locations: "classpath:/templates"
    static-path-pattern: /static/**
  thymeleaf:
    mode: LEGACYHTML5
    servlet:
      content-type: text/html
    prefix:
      classpath: /templates
    cache: false

然后创建一个Controller接口。代码如下示例

@Controller
public class IndexController {

    @RequestMapping(value = "index")
    public String index(){
        return "index";
    }
}

注意。不要用@RestController。因为我们需要的是一个页面。
过滤器里也设置一下（非必须）

这样就OK了。打个jar包。也一样能访问。
嗯。最后说一点。项目中如果有第三方依赖。最好导入到maven本地仓库。这样打成jar包。就不会报找不到类的错误啦。这个方法的答案，百度同样惊人的一致。照着弄就行。只不过有点麻烦。