项目
我有一个基于maven的项目，需要将其部署到本地tomcat服务器中(用于开发)。
现在，在前端，我想要一个grunt dev构建(jslint、concat、karma、sass等)。
我需要什么
- 一个不局限于一个IDE的解决方案(也应该在命令行中工作)
- 我不想只部署war文件dist文件夹
- 我不想每次更改客户端资源时都重新编译java：js、css、html、image等
- grunt应该观察文件并进行预处理/连接/lint/测试
- 观察之后，grunt应该将文件部署到本地tomcat并自动浏览页面
- 它必须快速！我的意思是不到一秒钟
我看了一些问题，但我不知道如何使其全部工作
这可能对您有效，也可能不适用，因为我不确定您是否希望所有东西都完全集成。
这种方法将允许您运行Tomcat服务器，允许您通过自动重新加载(加上您可能想要运行的任何其他任务)进行前端更改，而无需在Tomcat中重新编译/重新加载Java。我使用它，对于前端开发来说，它非常快。
总结思路：
-
使用任何方法运行Java应用程序(maven tomcat插件、Eclipse服务器选项卡等)。在标准端口(例如8080)上运行它。我假设你知道怎么做。
-
使用grunt、grunt contrib watch、grunt contrib connect、grunt contib proxy。在与tomcat不同的端口上运行grunt contrib connect，例如9000。在不同的端口上设置grunt-contrib代理，以代理从grunt-controb连接服务器到后端tomcat的请求，必要时重写URL。
为了让你开始，这里是Gruntfile.js的相关部分(修改到你的应用程序)：
// Watches files for changes and runs tasks based on the changed files
watch: {
js: {
files: ['<%= my.app %>/scripts/**/*.js'],
tasks: [],
options: {
livereload: '<%= connect.options.livereload %>'
}
},
livereload: {
options: {
livereload: '<%= connect.options.livereload %>'
},
files: [
'<%= my.app %>/**/*.html',
'<%= my.app %>/.tmp/styles/**/*.css',
'<%= my.app %>/images/**/*.{png,jpg,jpeg,gif,webp,svg}'
]
}
},
// The actual grunt server settings
connect: {
options: {
port: 9000,
// Change this to '0.0.0.0' to access the server from outside.
hostname: 'localhost',
livereload: 35729
},
proxies: [{
context: '/rest',
host: 'localhost',
port: 8080,
https: false,
changeOrigin: true,
rewrite: {
'^/rest': '/myapp/rest'
}
}],
livereload: {
options: {
open: true,
middleware: function(connect) {
return [
require('grunt-connect-proxy/lib/utils').proxyRequest,
connect.static('src/main/webapp/.tmp'),
connect.static('src/main/webapp/'),
];
}
}
},
要进行开发，您需要启动后端Tomcat应用程序，然后使用控制台运行：grunt serve。进行任何您想要的前端更改，它们将自动重新加载，并且任何相关的咕哝任务都将随着每次更改而运行。您的应用程序将正常工作，因为所有后端请求都代理到Tomcat，而前端请求则通过grunt contrib connect处理。
您的布局与许多项目的布局几乎相同。Grunt处理客户端资源，Maven构建Java后端，这很常见，我敢说是典型的。正如@wallace sidhree所说，Grunt也可以开箱即用地做你需要的大部分事情。
我建议你先读Grunt。Grunt让我陷入困境的部分是它奇怪的配置结构，所以配置指南是必读的。简而言之，您需要加载grunt contrib watch插件，该插件需要一个特定的Javascript对象用于initConfig中的配置。
手册中一个非常简单的例子是
// Simple config to run jshint any time a file is added, changed or deleted
grunt.initConfig({
watch: {
files: ['**/*'],
tasks: ['jshint'],
},
});
关于Tomcat，将Grunt的输出置于Tomcat的控制之下，至少在开发过程中是这样，这只会让人头疼。例如，每当Tomcat分解更改后的后端WAR时，Tomcat都会覆盖Grunt放入分解后的WAR中的任何客户端资源。为了避免这种情况，您需要将客户端资源放在不同的WAR中。但是，如果无论如何都要拆分它们，那么最好使用lighttpd或httpster托管客户端资源，至少在开发过程中是这样。这将有助于实现您的秒级更新。
我不确定独立于IDE的页面自动重新加载，我使用JetBrains的Chrome扩展；其他答案可能会更好地涵盖这一点。
对于这类项目，我的策略是通过恢复后端来将客户端与后端分离。通过这样做，我可以为我的后端服务使用任何类型的客户端。这是总结，让我们深入了解细节。
Backend:假设您的项目使用的是SpringMVC。您可以先设计您的模型和控制器部件。你的url映射应该是用户友好的结构，比如；
/user/update/{userId}
您有针对不同操作的服务，这意味着您的控制器不依赖于您的视图。您不返回ModelAndView，而是从您的服务返回json数据。您可以从web客户端、移动客户端或桌面客户端使用此服务。我想，你会有类似"限制部分怎么办？"的问题。在这个模型中，您将不使用java会话，您还将提供像Oauth或Oauth2这样的身份验证服务。简单地说，您有一个登录表单，用户输入用户名和密码。单击"登录"按钮时，用户名和密码将发送到后端并从数据库中进行评估。您生成了一个具有过期时间的唯一令牌。从现在起，您将使用此令牌完成您的请求。您还可以定义一个拦截器来检查每个请求的令牌有效性。您可以使用本地存储将此令牌保存在客户端中。最后，您有身份验证机制和服务。这些并不依赖于客户端应用程序。
前端：假设您有一个具有大量用户交互的客户端应用程序。您可以将AngularJS用于web应用程序，将Twitter Bootstrap用于主题化。例如，在文章列表页面中，您可以在页面加载时对后端服务进行ajax调用。使用AngularJS可以轻松做到这一点。此外，您还可以将返回的数据绑定到页面模型。好的，你有客户端应用程序，它能够向你的服务请求获取特定数据。例如AngularJS项目，您可以参考这里。您可以使用yeoman创建AngularJS项目。你也可以使用grunt来缩小，uglify，你的静态文件，你也可以在这里看看。
摘要：
- 您可以将后端代码与客户端应用程序分开部署
- 您可以根据需要开发多个客户端应用程序。今天，开发web应用程序，有朝一日开发移动应用程序
- 您将启动后端，然后打开客户端应用程序。您不需要任何容器或使用客户端应用程序。您可以使用apache等web服务器为您的客户端应用程序提供服务
您熟悉Grunt吗？如果配置得当，您可以开箱即用地完成您所要求的大部分内容。
- 您可以拆分任务，只运行想要运行的任务，即只编译与任务相关的资源
Grunt是基于命令行的，将在文件更改时运行(不需要IDE)watch任务不会部署任何内容，它只会关注文件更改并运行您在其中指定的任务。这些是将串联、美化/缩小、linted和测试文件部署到您指定的目录的任务- 构建的速度将取决于您正在运行的任务数量，以及任务必须深入应用程序才能输出。如果你想要少于一秒构建，你必须很好地划分任务，一次只运行几个任务
这是我的一个项目。它严重依赖Grunt，又瘦又快。：)
这可能不是一个你可能期望的解决方案，但这是一个线索。试着解决一些你想解决的问题，并按照我的建议从中积累。