更新：14.2中未发行

Vaadin 14.2和16已更改为现在在Maven驱动的项目中自动包含必需的 npm 工具。无需手动安装 Node.js ＆ npm 。

引用此博客文章：

自动安装Node.js

从版本14.2和16开始，Node.js安装（包括npm）自动进行。它安装

.vaadin

在主文件夹内的文件夹中，并从那里重新用于所有Vaadin项目。和以前一样，Node仅用于构建事物的前端。部署生产后它不会运行！

进一步的改进： pnpm 代替 npm 。

可行的前端依赖关系管理-
pnpm从14.0开始，在后台，npm被用于管理前端依赖关系。现在，我们增加了对pnpm的支持，它引入了以下好处：

1.
与本地计算机和CI系统上的npm相比，构建时间更短，因为pnpm只下载一次软件包并从本地缓存中重新使用它们。

1. 在项目中更新Vaadin版本时，无需删除package.json，锁定文件或node_modules文件夹。

在14.2中，默认情况下仍使用npm，但我们建议您测试pnpm并提供您的反馈。尝试pnpm很容易：无需迁移，只需使用配置属性或Maven插件配置启用它。您可以在此处了解有关pnpm的更多信息。Vaadin 16将默认使用pnpm。

我已经验证了此方法的效果。现在，我已经从Mac上手动删除了Node.js / npm安装。

tl; dr

该Vaadin
14团队期望你有Node.js的和NPM安装在计算机上的工具。

或者，Vaadin 14 似乎 正在与Node.js / npm一起使用，通过

frontend-maven-plugin

如果您想在计算机上全局安装Mode /
npm，请确保阅读另一本 Tom
Tomosad的Answer。

细节

从Vaadin 14开始，Vaadin团队正在切换：

• 从HTML imports，Bower和WebJars
• 使用Node.js到ES6 Modules，npm和Webpack

…作为它们从聚合物 2
过渡到聚合物3的一部分。

请参阅 Vaadin 14+中的
博客文章 Bower和npm 。

希望，作为Java上Vaadin的用户，我们不需要关心这些底层技术细节……但是，有一件事：不幸的是，
npm 和
Node.js 工具是必需的，但 __默认情况下 不
捆绑 在您的Vaadin项目中。

您有两种解决方案：

• 全局安装工具。
• 在您的项目中安装。

我更喜欢后者。而且我更喜欢让Maven在我的项目中自动安装它们，而让我减少手动管理的工作量。

CAVEAT： 我不知道我的node / npm-per-project解决方案的局限性或影响。我几乎不知道节点/
npm的目的或性质，也不知道Vaadin如何利用它们。因此，使用此解决方案需要您自担风险。我只能说这似乎对我有用。

添加

frontend-maven-plugin

到您的项目

frontend-maven-plugin

在您的Vaadin项目中打开Maven POM文件。

在该

<build> <defaultGoal>jetty:run</defaultGoal> <plugins>

    <plugin>        <groupId>com.github.eirslett</groupId>        <artifactId>frontend-maven-plugin</artifactId>        <!-- Use the latest released version:        https://repo1.maven.org/maven2/com/github/eirslett/frontend-maven-plugin/ -->        <version>1.8.0</version>        <executions> <execution>     <!-- optional: you don't really need execution ids, but it looks nice in your build log. -->     <id>install node and npm</id>     <goals>         <goal>install-node-and-npm</goal>     </goals>     <!-- optional: default phase is "generate-resources" -->     <phase>generate-resources</phase> </execution>        </executions>        <configuration> <nodeVersion>v10.16.3</nodeVersion> <!-- optional: with node version greater than 4.0.0 will use npm provided by node distribution --> <!--         <npmVersion>2.15.9</npmVersion>--> <!-- optional: where to download node and npm from. Defaults to https://nodejs.org/dist/ --> <!--         <downloadRoot>http://myproxy.example.org/nodejs/</downloadRoot>-->        </configuration>    </plugin>

当然，您可以调整该代码段以使用最新的版本号。检查Node.js的页面的最新版本号。

注意

npm

其余步骤：

1. 在

   Maven

   IntelliJ 的面板中，运行

   Lifecycle

   名为

   clean

   和的项目

   install

   。请稍等一下，下载并配置了更多项目。（请注意控制台历史记录中的“安装节点版本v10.16.3”项。）
2. 在同一面板的

   Plugins

   >区域中

   jetty

   ，运行该

   jetty:run

   项目。等待Jetty服务器启动以运行Vaadin应用程序，请稍等。

在控制台上，您应该看到类似以下的信息（所有Vaadin的发行版都常年出现这种神秘的

QuietTime

[INFO] Started Jetty Server[INFO] Using Non-Native Java sun.nio.fs.PollingWatchService[WARNING] Quiet Time is too low for non-native WatchService [sun.nio.fs.PollingWatchService]: 1000 < 5000 ms (defaulting to 5000 ms)

1. 将您的网络浏览器指向：

   http://localhost:8080/

   在您的应用成功运行时，看到“单击我”按钮。

该解决方案来自Maven插件的项目页面

frontend-maven-plugin

<execution>

<executions>

您可能需要在Vaadin论坛中关注此讨论。

供您参考，这是一个完整的POM文件，可以与您进行比较。

<?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>    <groupId>work.basil.example</groupId>    <artifactId>acme</artifactId>    <name>acme</name>    <version>2.0-SNAPSHOT</version>    <packaging>war</packaging>    <properties>        <maven.compiler.source>13</maven.compiler.source>        <maven.compiler.target>13</maven.compiler.target>        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>        <failOnMissingWebXml>false</failOnMissingWebXml>        <vaadin.version>14.0.5</vaadin.version>        <drivers.downloader.phase>pre-integration-test</drivers.downloader.phase>    </properties>    <repositories>        <repository> <id>central</id> <url>https://repo1.maven.org/maven2/</url> <snapshots>     <enabled>false</enabled> </snapshots>        </repository>        <!-- Repository used by many Vaadin add-ons -->        <repository> <id>Vaadin Directory</id> <url>https://maven.vaadin.com/vaadin-addons</url> <snapshots>     <enabled>false</enabled> </snapshots>        </repository>    </repositories>    <pluginRepositories>        <pluginRepository> <id>central</id> <url>https://repo1.maven.org/maven2/</url> <snapshots>     <enabled>false</enabled> </snapshots>        </pluginRepository>    </pluginRepositories>    <dependencyManagement>        <dependencies> <dependency>     <groupId>com.vaadin</groupId>     <artifactId>vaadin-bom</artifactId>     <type>pom</type>     <scope>import</scope>     <version>${vaadin.version}</version> </dependency>        </dependencies>    </dependencyManagement>    <dependencies>        <dependency> <groupId>com.vaadin</groupId> <!-- Replace artifactId with vaadin-core to use only free components --> <artifactId>vaadin</artifactId> <exclusions>     <!-- Webjars are only needed when running in Vaadin 13 compatibility mode -->     <exclusion>         <groupId>com.vaadin.webjar</groupId>         <artifactId>*</artifactId>     </exclusion>     <exclusion>         <groupId>org.webjars.bowergithub.insites</groupId>         <artifactId>*</artifactId>     </exclusion>     <exclusion>         <groupId>org.webjars.bowergithub.polymer</groupId>         <artifactId>*</artifactId>     </exclusion>     <exclusion>         <groupId>org.webjars.bowergithub.polymerelements</groupId>         <artifactId>*</artifactId>     </exclusion>     <exclusion>         <groupId>org.webjars.bowergithub.vaadin</groupId>         <artifactId>*</artifactId>     </exclusion>     <exclusion>         <groupId>org.webjars.bowergithub.webcomponents</groupId>         <artifactId>*</artifactId>     </exclusion> </exclusions>        </dependency>        <!-- Added to provide logging output as Vaadin uses -->        <!-- the unbound SLF4J no-operation (NOP) logger implementation -->        <dependency> <groupId>org.slf4j</groupId> <artifactId>slf4j-simple</artifactId>        </dependency>        <dependency> <groupId>javax.servlet</groupId> <artifactId>javax.servlet-api</artifactId> <version>3.1.0</version> <scope>provided</scope>        </dependency>        <dependency> <groupId>com.vaadin</groupId> <artifactId>vaadin-testbench</artifactId> <scope>test</scope>        </dependency>    </dependencies>    <build>        <defaultGoal>jetty:run</defaultGoal>        <plugins> <plugin>     <groupId>org.apache.maven.plugins</groupId>     <artifactId>maven-compiler-plugin</artifactId>     <version>3.8.1</version> </plugin> <!-- Jetty plugin for easy testing without a server --> <plugin>     <groupId>org.eclipse.jetty</groupId>     <artifactId>jetty-maven-plugin</artifactId>     <version>9.4.19.v20190610</version>     <configuration>         <!-- If using IntelliJ IDEA with autocompilation, this         might cause lots of unnecessary compilations in the         background.-->         <scanIntervalSeconds>2</scanIntervalSeconds>         <!-- Use war output directory to get the webpack files -->         <webAppConfig>  <allowDuplicateFragmentNames>true</allowDuplicateFragmentNames>         </webAppConfig>     </configuration> </plugin> <!--     Take care of synchronizing java dependencies and imports in     package.json and main.js files.     It also creates webpack.config.js if not exists yet. --> <plugin>     <groupId>com.vaadin</groupId>     <artifactId>vaadin-maven-plugin</artifactId>     <version>${vaadin.version}</version>     <executions>         <execution>  <goals>      <goal>prepare-frontend</goal>  </goals>         </execution>     </executions> </plugin> <plugin>     <groupId>com.github.eirslett</groupId>     <artifactId>frontend-maven-plugin</artifactId>     <!-- Use the latest released version:     https://repo1.maven.org/maven2/com/github/eirslett/frontend-maven-plugin/ -->     <version>1.8.0</version>     <executions>         <execution>  <!-- optional: you don't really need execution ids, but it looks nice in your build log. -->  <id>install node and npm</id>  <goals>      <goal>install-node-and-npm</goal>  </goals>  <!-- optional: default phase is "generate-resources" -->  <phase>generate-resources</phase>         </execution>     </executions>     <configuration>         <nodeVersion>v10.16.3</nodeVersion>         <!-- optional: with node version greater than 4.0.0 will use npm provided by node distribution -->         <!--         <npmVersion>2.15.9</npmVersion>-->         <!-- optional: where to download node and npm from. Defaults to https://nodejs.org/dist/ -->         <!--         <downloadRoot>http://myproxy.example.org/nodejs/</downloadRoot>-->     </configuration> </plugin>        </plugins>    </build>    <profiles>        <profile> <!-- Production mode is activated using -Pproduction --> <id>production</id> <properties>     <vaadin.productionMode>true</vaadin.productionMode> </properties> <dependencies>     <dependency>         <groupId>com.vaadin</groupId>         <artifactId>flow-server-production-mode</artifactId>     </dependency> </dependencies> <build>     <plugins>         <plugin>  <groupId>com.vaadin</groupId>  <artifactId>vaadin-maven-plugin</artifactId>  <executions>      <execution>          <goals>   <goal>build-frontend</goal>          </goals>          <phase>compile</phase>      </execution>  </executions>         </plugin>     </plugins> </build>        </profile>        <profile> <id>integration-tests</id> <build>     <plugins>         <plugin>  <groupId>org.eclipse.jetty</groupId>  <artifactId>jetty-maven-plugin</artifactId>  <version>9.4.19.v20190610</version>  <configuration>      <scanIntervalSeconds>0</scanIntervalSeconds>      <stopPort>8081</stopPort>      <stopWait>5</stopWait>      <stopKey>${project.artifactId}</stopKey>  </configuration>  <executions>      <execution>          <id>start-jetty</id>          <phase>pre-integration-test</phase>          <goals>   <goal>deploy-war</goal>          </goals>      </execution>      <execution>          <id>stop-jetty</id>          <phase>post-integration-test</phase>          <goals>   <goal>stop</goal>          </goals>      </execution>  </executions>         </plugin>         <!-- Runs the integration tests (*IT) after the server is started -->         <plugin>  <groupId>org.apache.maven.plugins</groupId>  <artifactId>maven-failsafe-plugin</artifactId>  <version>3.0.0-M3</version>  <executions>      <execution>          <goals>   <goal>integration-test</goal>   <goal>verify</goal>          </goals>      </execution>  </executions>  <configuration>      <trimStackTrace>false</trimStackTrace>      <enableAssertions>true</enableAssertions>      <systemPropertyVariables>          <!-- Pass location of downloaded webdrivers to the tests -->          <webdriver.chrome.driver>${webdriver.chrome.driver}</webdriver.chrome.driver>      </systemPropertyVariables>  </configuration>         </plugin>         <plugin>  <groupId>com.lazerypre.selenium</groupId>  <artifactId>driver-binary-downloader-maven-plugin</artifactId>  <version>1.0.17</version>  <configuration>      <onlyGetDriversForHostOperatingSystem>true      </onlyGetDriversForHostOperatingSystem>      <rootStandaloneServerDirectory>          ${project.basedir}/drivers/driver      </rootStandaloneServerDirectory>      <downloadedZipFileDirectory>          ${project.basedir}/drivers/driver_zips      </downloadedZipFileDirectory>      <customRepositoryMap>          ${project.basedir}/drivers.xml      </customRepositoryMap>  </configuration>  <executions>      <execution>          <!-- use phase "none" to skip download step -->          <phase>${drivers.downloader.phase}</phase>          <goals>   <goal>selenium</goal>          </goals>      </execution>  </executions>         </plugin>     </plugins> </build>        </profile>    </profiles></project>