ng build和webpack之间有什么区别

Question

据我了解，ng-build创建了一个可分发的应用程序打包版本。我也理解webpack用于捆绑Javascript模块。

我在测试项目上运行ng build，发现它创建了一个dist文件夹，其中包含看起来像我的Angular应用程序的打包版本。所有.js文件已合并，但我引用的.css文件保留原始格式（未捆绑或缩小）。

因此，使用ng build或webpack来完成这项工作有什么区别。或者他们是免费的？我是否可能在我的部署管道中使用它们？

Answer 1

不是一个完整的答案，但值得注意：

如果您的css文件未编译，则可能意味着：

1. 您运行ng build（a.k.a。ng build --dev），将default --extract-css添加到false：

  

- extract-css（别名：-ec）

     

将css从全局样式提取到css文件而不是js文件。

1. 您运行ng build --prod但忘记将您的样式引用为angular.cli.json中的全局样式：

   "styles": [ "styles.css", "assets/styles/test.component.css" ],

执行此操作后，您会发现内联的css文件，但您也会以正常格式找到它们。不明白为什么会这样......

Answer 2

Webpack和ng-build几乎完成相同的工作，即捆绑您的模块以在浏览器环境中使用。例如，Angular模块是一个功能，在浏览器中不支持，ES 6个模块还没有在任何浏览器中实现，这就是为什么需要捆绑的东西。仅为角度构建。我们可以webpack任何UI相关的应用程序，包括角度。