spring-boot - 使用 webpack devserver 时访问 Thymeleaf Spring Boot application.properties
问题描述
在 http://localhost:8081 上浏览应用程序时,我可以从 application.properties 访问相关属性值,但不能通过 http://localhost:9090 使用 webpack 开发服务器。
webpack.dev.js(开发服务器)
const merge = require('webpack-merge');
const common = require('./webpack.common.js');
module.exports = merge(common, {
plugins: [
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
template: 'src/main/resources/templates/index.html',
title: 'Example Application'
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery',
Popper: ['popper.js', 'default']
})
],
.
.
mode: 'development',
devServer: {
historyApiFallback: true,
hot: true,
port: 9090,
proxy: {
'/': {
target: 'http://localhost:8081',
secure: false,
prependPath: false
}
},
publicPath: 'http://localhost:9090/'
},
devtool: 'inline-source-map',
});
索引.html
<html>
<head>
.
.
<script th:inline="javascript">
var SERVICES_URL = [[${servicesUrl}]];
var MAPS_URL = [[${mapsUrl}]];
</script>
</head>
<body>
<div id="react"></div>
<script src="/bundle.js"></script>
</body>
</html>
应用程序属性
services.url=https://example1.com
maps.url=https://example2.com
在使用 webpack 开发服务器时访问任何 javascript 文件中的变量 SERVICES_URL 时,我收到以下错误,因为 Thymeleaf 没有为该变量分配值。
SyntaxError: missing ] after element list
我假设它在 webpack 开发服务器上不起作用,因为它只提供前端代码而不是嵌入式 tomcat 服务器,后者也提供服务器端代码。
解决方案
解决这个问题的方法是从 webpack 配置文件中删除 HtmlWebpackPlugin,这样索引就不会从资源文件中加载,而是从 Thymeleaf 完成后的响应中加载。
plugins: [
new CleanWebpackPlugin(),
// new HtmlWebpackPlugin({
// template: 'src/main/resources/templates/index.html',
// title: 'Example Application'
// }),
new webpack.HotModuleReplacementPlugin(),
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery',
Popper: ['popper.js', 'default']
})
],
推荐阅读
- react-native - 世博相机没有显示相机看到的东西
- kotlin - 使用 randomUUID 时的 UUID 冲突
- influxdb - InfluxDB 1.7.2 - 随着时间的推移 Top X
- html - 仅在与主体形状接触时产生粘性效果
- ios - TableView根据单元格宽度水平滚动
- javascript - 在哪里存储访问令牌以供前端使用
- javascript - 为什么我的猫鼬验证回调返回;TypeError:响应不是函数
- json - JSON stringify 不产生预期的 json
- scikit-learn - 如何为 RandomSearchCV 定义具有两个隐藏层的 MLPR
- xcode - Apollo 的检查并运行 apollo-codegen.sh 不起作用?