Question

在使用webpack构建时尝试优化供应商捆绑包时，我使用的是NgcWebpackPlugin。

这是视觉呈现的供应商包：

令我惊讶的是，即使我们正在使用AOT，角度编译器模块的存在也是如此。

我是否需要以某种方式明确声明我不需要捆绑中的编译器？或者我错过了其他什么？

这是dframe %>% group_by(id) %>% do({ setNames( data.frame(t(combn(.$product, 2)), stringsAsFactors=F), c("product1", "product2")) }) #Source: local data frame [7 x 3] #Groups: id [2] # id product1 product2 # <dbl> <chr> <chr> #1 1234 Apple Pear #2 3456 Apple Pear #3 3456 Apple Grapes #4 3456 Apple Kiwi #5 3456 Pear Grapes #6 3456 Pear Kiwi #7 3456 Grapes Kiwi：

vendor.ts

这是import '@angular/platform-browser'; import '@angular/platform-browser-dynamic'; import '@angular/core'; import '@angular/common'; import '@angular/http'; import '@angular/router'; import '@angular/forms' import '@angular/animations' import 'rxjs'; import '@ngrx/core'; import '@ngrx/store'; import 'platform'; import 'underscore'; import 'typed-immutable-record'; import 'toastr'; import 'socket.io-client'; import 'moment'; import 'moment-timezone'; import 'jquery'; import 'immutable'; import 'humanize-duration'; import 'fuzzy'; import 'bricklayer'; import 'ngx-bootstrap';：

boot-aot.ts

Answer 1

在vendor.ts中删除导入'platform-browser-dynamic'并在您的webpack配置中手动删除不需要的模块。

示例webpack配置：

var empty = {
    NgProbeToken: {},
    HmrState: function() {},
    _createConditionalRootRenderer: function(rootRenderer, extraTokens, 
coreTokens) {
      return rootRenderer;
    },
    __platform_browser_private__: {}
  };

return {
    module: {
      rules: [
        ({
          test: /\.ts$/,
          use: removeEmpty([
            {
              loader: '@angularclass/hmr-loader',
              options: {
                pretty: isDev,
                prod: isProd
              }
            },
            {
              /**
               *  MAKE SURE TO CHAIN VANILLA JS CODE, I.E. TS COMPILATION 
OUTPUT.
               */
              loader: 'ng-router-loader',
              options: {
                loader: 'async-import',
                genDir: 'compiled',
                aot: isProd
              }
            },
            {
              loader: 'awesome-typescript-loader',
              options: {
                configFileName: 'tsconfig.webpack.json',
                useCache: !isProd
              }
            },
            ifProd(WebpackStrip.loader('console.log', 'console.info', 
'console.error')),
            {
              loader: 'angular2-template-loader'
            }
          ]),
          exclude: [/\.(spec|e2e)\.ts$/]
        })
      ]
    },
    plugins: [
    new ngcWebpack.NgcWebpackPlugin({
      disabled: !isProd,
      tsConfig: resolve('tsconfig.webpack.json')
    }),

    new NormalModuleReplacementPlugin(
      /zone\.js(\\|\/)dist(\\|\/)long-stack-trace-zone/,
      empty
    ),

    new HashedModuleIdsPlugin(),

     new NormalModuleReplacementPlugin(
       /@angular(\\|\/)upgrade/,
       empty
     ),
     new NormalModuleReplacementPlugin(
       /@angular(\\|\/)compiler/,
       empty
     ),
     new NormalModuleReplacementPlugin(
       /@angular(\\|\/)platform-browser-dynamic/,
       empty
     ),
     new NormalModuleReplacementPlugin(
       /dom(\\|\/)debug(\\|\/)ng_probe/,
       empty
     ),
     new NormalModuleReplacementPlugin(
       /dom(\\|\/)debug(\\|\/)by/,
       empty
     ),
     new NormalModuleReplacementPlugin(
       /src(\\|\/)debug(\\|\/)debug_node/,
       empty
     ),
     new NormalModuleReplacementPlugin(
       /src(\\|\/)debug(\\|\/)debug_renderer/,
       empty
     )
  ]
};

优化Angular供应商输出

1 个答案: