logo标签列表

如何使用webpack和angular2部署生产代码

jqueryangularjsnode.jsexpressangular
4
我有一个使用webpack和grunt的angular 2代码。在开发模式下，我使用webpack-dev-server来加载它，并将其作为grunt任务运行。
在进行生产部署的代码构建时，我使用Grunt进行所有缩小等操作，并创建dist /文件夹。
但是我该如何运行这个dist /文件夹？要使用哪个服务器？
我阅读到不应该将webpack-dev-server用于生产部署。因此，我开始寻找其他选项，可以启动一个作为grunt命令的服务器。
我发现不应该使用grunt：server。
然后开始思考express服务器，但我真的不确定。
我想要的只是使用服务器呈现我创建的dist/文件夹。我正在使用webpack
我的问题是：
1.我们不应该将服务器作为grunt任务启动吗？ 应该改用npm脚本吗？ 2.我应该使用哪个服务器来部署使用webpack的生产级代码？
我在我的服务器上安装了Node.js。我应该编写脚本来在Node中创建一个服务器吗？ - Bhumi Singhal
1个回答
0

我的dist文件夹位于wwwroot下面。它被引用于index.html文件中，该文件也位于wwwroot下面。原始文件位于应用程序的ClientApp文件夹中。

WebPack将来自我的ClientApp文件夹的文件进行最小化和部署，并将它们放在dist下的main.js文件中。

WebPack还对所有供应商文件执行此操作，这些文件实际上存储在项目根路径中的node_modules文件夹中。它将它们放在vendor.js中。

它也会对css文件执行相同的操作。请参见下面的index.html文件。看到对/dist/文件夹的引用了吗？

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Home Page - MyApp</title>
  <base href="/" />
  <link rel="stylesheet" href="/dist/vendor.css" />
  <link rel="stylesheet" href="/dist/styles.css" />
</head>
<body >

    <my-app />

  <script src="/dist/vendor.js"></script>
  <script src="/dist/main.js"></script>

</body>
</html>
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接