Question

我正在使用角度为6的webpack，因此创建了自己的自定义webpack文件，但是问题无法通过aot完成，我也已在代码中实现了延迟加载。我已经检查了教程，他们都提到了我已经完成的步骤，但仍然无法实现

package-json - {

     "scripts": {

    "webpack-build": "webpack --mode production  --config ./webpack.config.js",

    "watch": "webpack --mode development --watch --port 4200 --host 0.0.0.0  --disable-host-check  ",

    "start:dev": "webpack-dev-server --mode development  --inline --progress --colors --proxy-config proxy.conf.json --port 4200 --host 0.0.0.0  --disable-host-check  --watch --config ./webpack.config.js"

}

我的webpack文件-

 "use strict";

 const {resolve} = require('path');

 const rxPaths = require('rxjs/_esm5/path-mapping');
 ...
 const {AngularCompilerPlugin}  = require('@ngtools/webpack');
 module.exports =  {

mode: 'development',
devtool: "eval-source-map" ,

entry: {
  main: './src/main.ts',
  polyfills: './src/polyfills.ts',
},

output: {
  path: resolve('./dist'),
  filename: '[name].js',
  crossOriginLoading: false
},

resolve: {
  extensions: ['.ts', '.js'],
  alias: rxPaths()
},

node: false,

performance: {
  hints: 'warning',
},

module: {
  rules: [
    {
      test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
      use: '@ngtools/webpack'
    },
    {
      test: /\.js$/,
      loader: '@angular-devkit/build-optimizer/webpack-loader',
      options: {sourceMap: true}
    },
    {
      test: /\.js$/,
      exclude: /(ngfactory|ngstyle).js$/,
      enforce: 'pre',
      use: 'source-map-loader'
    },

    // This hides some deprecation warnings that Webpack throws
    {
      test: /[\/\\]@angular[\/\\]core[\/\\].+\.js$/,
      parser: {system: true},
    }
  ]
},


plugins: [
  new AngularCompilerPlugin({
    mainPath: resolve('./src/main.ts'),
    tsConfigPath: resolve('./src/tsconfig.app.json'),
    entryModule: resolve('./src/app/app.module#AppModule'),
    platform: 0,
    sourceMap: true,
    nameLazyFiles: false,
    skipCodeGeneration: true,
    hostReplacementPaths: {
      [resolve('src/environments/environment.ts')]: resolve('src/environments/environment.prod.ts')
    }
  }),
],
devServer: {
  "historyApiFallback": true
}
};

但是当我运行npm run start:dev时，出现此错误：

Uncaught Error: Unexpected value 'BrowserAnimationsModule' imported 
bythe .    module 'AppModule'. Please add a @NgModule annotation.
at syntaxError (util.ts?51ce:100)
at eval (metadata_resolver.ts?94bc:555)
at Array.forEach (<anonymous>)
at CompileMetadataResolver.getNgModuleMetadata
(metadata_resolver.ts?94bc:524)
at JitCompiler._loadModules (compiler.ts?89b5:127)
at JitCompiler._compileModuleAndComponents (compiler.ts?89b5:107)
at JitCompiler.compileModuleAsync (compiler.ts?89b5:61)
at CompilerImpl.compileModuleAsync (compiler_factory.ts?a7a0:57)
at PlatformRef.bootstrapModule (application_ref.ts?cc36:274)
at eval (main.ts?cd49:10)

该错误表明jit编译器正在工作，无法找到有什么问题

aot编译器webpack和angular 6

0 个答案: