Question

我正在尝试运行以下示例： https://github.com/ceolter/ag-grid-react-example

（ag-grid反应实例）

但是，我没有做npm run而是想在tomcat上运行它。怎么做？

Answer 1

您可以在Tomcat上轻松部署任何静态文件。您链接的项目没有用于构建示例生产版本的脚本，因此您需要做的是：

在本地安装 webpack ：npm install -g webpack
构建演示：webpack --config webpack.config.standard.js --progress --colors --hot --inline或webpack --config webpack.config.large.js --progress --colors --hot --inline。它将创建dist目录。
在Tomcat webapps目录中，为您的演示ag-grid创建另一个目录。
将index.html和dist复制到ag-grid。
访问http://host:port/ag-grid。

Answer 2

执行

npm run build

这将在项目树内的build子文件夹中创建应用的可部署版本。您现在需要的是将index.html及其所有朋友从此文件夹复制到用于提供静态文件的Tomcat目录中。这是Tomcat应用程序文件夹中的顶级。标准目录布局记录为here。

如here所述，构建真实的Web应用程序（.war）也非常简单。静态文件只驻留在存档的顶层，您还应该在存档内的WEB-INF / web.xml中配置默认页面。可以从Tomcat管理控制台部署此类应用程序。

Answer 3

有不同的方法可以在Tomcat上部署React J.Deploy在tomcat或任何servlet容器中反应JS是一个挑战，有点棘手。我正在开发的应用程序中存在一个问题。我在我的应用程序中使用了BrowserRouter。

所以问题是代码中没有错误，但没有任何内容正在加载。我看到没有错误的白屏。我检查了控制台，看到它为我的一些捆绑的静态资源抛出了404.

注意到一个奇怪的行为，如果我在web pack dev服务器中运行应用程序，相同的代码工作正常，路由器也能正常工作。但是一旦我部署到tomcat，就没有观察到相同的行为。

如您所知，BrowserRouter使用HTML5历史记录API来保持您的UI与URL同步。例如，如果您使用带有/ todos / 42路由的React路由器，webpack开发服务器将正确响应localhost：3000 / todos / 42，但上面的生产版本不会。

Check out this link to understand the problem.

我们还可以更新package.json。

如果你想将它作为基于java的项目的一部分运行，那么你可以使用maven exec插件在exec参数中构建并运行 npm run build 。

Answer 4

<html>
<head>
    <title>Redux Counter Example</title>
</head>
<body>
    <div id="root">
    </div>
</body>
<script src="~/Scripts/frontend/dist/bundle.js"></script>
</html>

Answer 5

即使我没有使用Tomcat执行此操作，我也使用IIS进行了部署。所以你可以让方法适应Tomcat。

我创建了一个带有默认控制器和默认视图的Empty MVC应用程序，以获得Microsoft提供的所有MVC魔力。
我使用webpack构建了React + Redux应用程序，并将所有内容发送到一个dist文件夹，该文件夹包含应用程序所需的所有资源。了解如何使用webpack构建React应用程序以获取更多详细信息。
在我的主视图传递的脚本标记中，我将其设置为指向包含所有React代码的dist文件夹。
我通过Visual Studio构建过程运行应用程序，当IIS提供视图时，React代码启动。
路由工作也很好，Redux开发工具。

DefaultController.cs

public class DefaultController : Controller
{
    // GET: Default
    public ActionResult Index()
    {
        return View();
    }
}

RouteConfig.cs

public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                name: "Default",
                url: "",
                defaults: new { controller = "Default", action = "Index" }
            );

            routes.MapMvcAttributeRoutes();
        }
    }

Default.cshtml

＆＃13;

<html>
<head>
    <title>Redux Counter Example</title>
</head>
<body>
    <div id="root">
    </div>
</body>
<script src="~/Scripts/frontend/dist/bundle.js"></script>
</html>

＆＃13;

如何在tomcat上运行react应用程序

5 个答案: