SpringBoot和AngularJs -更新Intellij中修改的静态文件(js/html/css)
SpringBoot和AngularJs -更新Intellij中修改的静态文件(js/html/css)
提问于 2020-03-22 13:27:48
我正在使用Intellij开发一个SpringBoot和AngularJs应用程序。每当我修改静态文件(html/js/css)时，我必须重新启动应用程序，以便应用更改。在不重新启动应用程序的情况下，我如何做到这一点。这真的占用了我的开发时间。
注:我试过Recompile <my-file> (Ctrl+Shift+F9)的Build菜单，但它不起作用。
下面是一个示例应用程序
结构
文件
pom.xml
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.8.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>org.example</groupId>
<artifactId>SampleAngularJs</artifactId>
<version>1.0-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-locator-core</artifactId>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>angularjs</artifactId>
<version>1.7.9</version>
</dependency>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>angular-router</artifactId>
<version>0.5.3</version>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
主类(Application.java)
@SpringBootApplication
public class Application {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
@Controller
public static class Contr {
@GetMapping("/welcome")
public String welcome() {
return "welcome";
}
@GetMapping("/templates/dashboard.html")
public String dashboard() {
return "dashboard";
}
}
}index.html
<!DOCTYPE html >
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body ng-app="my-app">
<div ng-controller="LoginController">
<label>Username</label>
<input type="text" name="username"/>
<label>Password</label>
<input type="text" name="password"/>
<button ng-click="login()">Login</button>
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<!--Angular Core-->
<script src="/webjars/angularjs/angular.min.js" type="text/javascript"></script>
<!--Angular router-->
<script src="/webjars/angularjs/angular-route.min.js" type="text/javascript"></script>
<script type="text/javascript">
angular.module('my-app', ['ngRoute'])
.controller('LoginController', function ($scope, $window) {
$scope.login = function () {
$window.location.href = '/welcome';
}
});
</script>
</body>
</html>welcome.html
<!DOCTYPE html>
<html lang="en" ng-app="my-app">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
<p>Main page with ng-view</p>
</div>
<div ng-view="" autoscroll="true"></div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"></script>
<!--Angular Core-->
<script src="/webjars/angularjs/angular.min.js" type="text/javascript"></script>
<!--Angular router-->
<script src="/webjars/angularjs/angular-route.min.js" type="text/javascript"></script>
<script type="text/javascript">
var app = angular.module('my-app', ['ngRoute']);
app.config(function ($httpProvider, $routeProvider, $locationProvider) {
$locationProvider.hashPrefix('');
$routeProvider
.when('/', {
templateUrl: 'templates/dashboard.html',
controller: ''
})
.otherwise(
{redirectTo: '/'}
);
$httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
});
</script>
</body>
</html>dashboard.html
<div>
<h1>Dashboard View</h1>
</div>唯一可更新的文件(Build > Recompile 'index.html')是index.html。如果我试图重新编译(更新) welcome.html或dashboard.html，它将失败。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-03-27 16:56:49
问题不是AngularJS和SpringBoot。问题是Thymeleaf和SpringBoot。有一个配置需要添加到application.properties中，它禁用SpringBoots Thymeleaf缓存。
spring.thymeleaf.cache=false将值设置为false。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60799883
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号