angular-cli在哪里是webpack.config.js文件 - 新的angular6不支持ng弹出

Question

更新:2018年12月(参见'Aniket'回答)

使用Angular CLI 6,您需要使用构建器,因为不推荐使用ng eject,很快就会在8.0中删除它

更新:2018年6月:Angular 6不支持ng弹出**

更新:2017年2月:使用ng弹出

更新:2016年11月:angular-cli现在只使用webpack.您只需要使用npm install -g angular-cli正常安装."我们改变了beta.10和beta.14之间的构建系统,从SystemJS到Webpack."但实际上我只使用angular-cli来结构和文件夹,然后再使用webpack配置

我用这个安装了角度cli:

npm install -g angular-cli@webpack

当我使用angular1和web pack时,我曾经修改过"webpack.config.js"文件来执行所有的任务和插件,但我没有看到使用angular-cli创建的这个项目是谁工作的.这是魔法？

当我这样做时,我看到Webpack正在工作:

ng serve 

"Version: webpack 2.1.0-beta.18"

但我不明白angular-cli配置的工作方式......

Answer 1

有一种从angular-cli中弹出webpack.config.js的好方法.赶紧跑:

$ ng eject

这将在项目的根文件夹中生成webpack.config.js,您可以根据需要自由配置它.这样做的缺点是package.json中的build/start脚本将被替换为新命令而不是

$ ng serve

你必须要做类似的事情

$ npm run build & npm run start

这个方法应该适用于所有最新版本的angular-cli(我个人试过几个,最老的是1.0.0-beta.21,最新的1.0.0-beta.32.3)

Answer 2

根据这个问题,设计决定是不允许用户修改Webpack配置以减少学习曲线.

考虑到Webpack上有用的配置数量,这是一个很大的缺点.

我不建议angular-cli用于生产应用程序,因为它是高度自以为是.

Answer 3

使用Angular CLI 6,您需要使用构建器,因为不推荐使用ng eject,很快就会在8.0中删除它.当我尝试进行弹出时,它就是这么说的

您可以使用angular-builders包(https://github.com/meltedspark/angular-builders)来提供自定义webpack配置.

我试图在我的博客上的一篇博客文章中总结所有内容 - 如何使用Angular CLI 6中的自定义webpack配置自定义构建配置

但基本上你添加以下依赖项 -

  "devDependencies": {
    "@angular-builders/custom-webpack": "^7.0.0",
    "@angular-builders/dev-server": "^7.0.0",
    "@angular-devkit/build-angular": "~0.11.0",

在angular.json中进行以下更改 -

  "architect": {
    "build": {
      "builder": "@angular-builders/custom-webpack:browser",
      "options": {
        "customWebpackConfig": {"path": "./custom-webpack.config.js"},

请注意构建器和新选项customWebpackConfig中的更改.也改变

    "serve": {
      "builder": "@angular-builders/dev-server:generic",

请注意对于服务目标的构建器的更改.发布这些更改后,您可以在同一根目录中创建名为custom-webpack.config.js的文件,并在其中添加您的webpack配置.

但是,与此处提供的ng弹出配置不同,它将与默认配置合并,因此只需添加要编辑/添加的内容.

Answer 4

现在可以弹出CLI的webpack配置.检查Anton Nikiforov的回答.

过时的:

你可以破解配置模板angular-cli/addon/ng2/models.截至目前,还没有正式的方法来修改webpack配置.

关于这个问题,github上有一个封闭的"不会修复"问题:https://github.com/angular/angular-cli/issues/1656