使用Angular2 fronend在Heroku Java应用程序上部署

在使用Angular 2 fronend部署基于Java的应用程序时，我遇到了一个问题

我的应用程序需要与NodeJs一起安装，它的“npm安装”可以从package.json获取所有依赖项。 而且只比maven好。 Angular2应用程序位于java webapp文件夹中。 我看到buildpacks安装了它。但是它们不起作用。例如 这个

它在根目录中搜索*.ts文件，但不在“webapp”java文件夹中搜索。 有没有一些智能构建包来完成这样的任务，或者其他简单方便的方法来完成

---

提前谢谢你

在Heroku的支持下，你可以做到这一点。简言之，从长远来看：

$ heroku buildpacks:clear
$ heroku buildpacks:add heroku/nodejs
$ heroku buildpacks:add heroku/java

在您的例子中，情况可能非常类似于，它使用Node.js和angular。有几件事需要考虑：

• Heroku Node.js构建包。您需要将它们移动到

  dependencies

  或设置配置变量

  NPM\u config\u PRODUCTION=false

• 如果您在运行时不需要

  node\u模块

  目录或node.js运行时，它将使您的应用程序变得巨大。您可以使用Maven删除它们

下面是一个例子：

<plugin>
  <artifactId>maven-clean-plugin</artifactId>
  <version>2.5</version>
  <executions>
    <execution>
      <id>clean-build-artifacts</id>
      <phase>install</phase>
      <goals><goal>clean</goal></goals>
      <configuration>
        <excludeDefaultDirectories>true</excludeDefaultDirectories>
        <filesets>
          <fileset>
            <directory>node_modules</directory>
          </fileset>
          <fileset>
            <directory>.heroku/node</directory>
          </fileset>
        </filesets>
      </configuration>
    </execution>
  </executions>
</plugin>

.
我使用这个插件：


这将我编译的angular 2 javascript复制到src/main/resources/public中

<plugin>
   <groupId>com.github.eirslett</groupId>
    <artifactId>frontend-maven-plugin</artifactId>
    <version>1.0</version>
    <executions>
      <execution>
       <id>install node and npm</id>
       <goals>
        <goal>install-node-and-npm</goal>
       </goals>
       <configuration>
        <nodeVersion>v4.4.3</nodeVersion>
        <npmVersion>3.8.3</npmVersion>                                    
       </configuration>
     </execution>
     <execution>
      <id>npm install</id>
       <goals>
        <goal>npm</goal>
       </goals>
      <configuration>
        <arguments>--strict-ssl=false install</arguments>
      </configuration>
      </execution>                            
      <execution>
      <id>npm build prod</id>
      <goals>
       <goal>npm</goal>
      </goals>
     <configuration>
    <arguments>run build.prod</arguments>
    </configuration>
    </execution>
   </executions>
  </plugin>

import * as gulp from 'gulp';
let gnf = require('gulp-npm-files');
let resourceDest = 'src/main/resources/public';

export = () => {

        gulp.src('**', {cwd:'./dist/prod'}).pipe(gulp.dest(resourceDest));
        gulp.src(gnf(), {base:'./'}).pipe(gulp.dest(resourceDest));


};