Jquery 包括ES6和带有spring boot的Webpack

我有一个spring引导应用程序要在现有的Tomcat服务器中修改和部署。应用程序使用1.5.4版本，前端使用thymeleaf、Jquery（4）和引导。在某些情况下，前端直接访问控制器和rest API

我的生产部署确实有资源限制，没有单独的服务器可用，应用程序需要在tomcat中运行。没有分离前端和后端并使用前端节点服务器的选项

---

我希望在前端脚本中包含webpack或babel/es6（以利用这些特性并使用承诺等特性），以解决一些复杂的AJAX调用回调异步问题。我在谷歌上搜索和阅读，有很多选择。感谢您提供有关如何执行此操作的任何指导和步骤

您需要将前端与后端源分离，或者分离Maven/Gradle模块，或者将前端相关的内容放入

src/main/frontend

然后，您需要修改生成过程：

强> Mave<强> -考虑使用-它将下载节点，NPM，并执行NPM任务
• Gradle-上次我玩它的时候，插件是最重要的，但从那时起事情可能已经改变了。您可以在此处查看我当时的设置：

Maven/Gradle应该将前端

build

目录放入Spring Boot公开的静态资源中

---

祝你好运

可能有几种方法可以做到这一点，但如果您碰巧使用Gradle，您可以尝试以下解决方案：

在build.gradle脚本中添加节点插件：

plugins {
  id "com.moowork.node" version "1.2.0"
}

（可选）配置插件（请参阅：）

定义运行Web包的npm任务，并确保在处理资源之前执行该任务

task webpack(type: NodeTask, dependsOn: 'npmInstall') {
    script = project.file('node_modules/.bin/webpack')
}

processResources.dependsOn 'webpack'

配置网页包，使其输出到某个特定文件夹。为了与gradle保持一致，您可以将其输出到

build/

文件夹中的某个文件夹：

const path = require('path');
const ROOT = path.resolve(__dirname, 'src/main/webapp');
const DEST = path.resolve(__dirname, 'build/fe');

module.exports = {
  entry: [
    path.resolve(ROOT, 'js/scripts.js')
  ],
  output: {
    path: DEST,
    filename: 'dist/bundle.js'
  },
  // ...
}

确保网页包的输出随后作为资源由gradle build处理：

processResources {
  with copySpec {
    from "${buildDir}/fe"
    include "**/*.js"
    into "static"
  }
}

下面是一个示例存储库，演示了完整的解决方案：

---

我觉得这里有些混乱。Webpack是一种软件，用于将项目构建到服务器将使用的文件中。据我所知，这不是你会直接提供给网页的东西。如果你真正想要的是保证你的用户有ES6方法可用，比如承诺，你可能会先尝试在你的应用程序中加入ECMAScript 6垫片，然后再进行更大的更改。

processResources {
  with copySpec {
    from "${buildDir}/fe"
    include "**/*.js"
    into "static"
  }
}