Angular 角度测试台-Karma/Jasmine |导入意外值';浏览器动态测试模块';|角AOT

Angular 角度测试台-Karma/Jasmine |导入意外值';浏览器动态测试模块';|角AOT,angular,karma-webpack,Angular,Karma Webpack,测试台代码示例,遵循指南- 抛出错误- Error: Unexpected value 'BrowserDynamicTestingModule' imported by the module 'DynamicTestModule'. Please add a @NgModule annotation. at syntaxError (webpack-internal:///1394:723:34) at eval (webpack-interna

测试台代码示例,遵循指南-

抛出错误-

        Error: Unexpected value 'BrowserDynamicTestingModule' imported by the module 'DynamicTestModule'. Please add a @NgModule annotation.
        at syntaxError (webpack-internal:///1394:723:34)
        at eval (webpack-internal:///1394:15544:48)
        at Array.forEach (<anonymous>)
        at CompileMetadataResolver.getNgModuleMetadata (webpack-internal:///1394:15519:53)
        at JitCompiler._loadModules (webpack-internal:///1394:34773:74)
        at JitCompiler._compileModuleAndAllComponents (webpack-internal:///1394:34751:40)
        at JitCompiler.compileModuleAndAllComponentsSync (webpack-internal:///1394:34639:46)
        at CompilerImpl.compileModuleAndAllComponentsSync (webpack-internal:///1409:264:58)
        at TestingCompilerImpl.compileModuleAndAllComponentsSync (webpack-internal:///1408:333:35)
        at TestBed._initIfNeeded (webpack-internal:///1393:998:36)
        at TestBed.get (webpack-internal:///1393:1069:14)
        at Function.TestBed.get (webpack-internal:///1393:854:29)
        at Object.eval (webpack-internal:///1413:10:42)
        at ZoneDelegate.invoke (webpack-internal:///781:392:26)
        at ProxyZoneSpec.onInvoke (webpack-internal:///1403:81:43)
        at ZoneDelegate.invoke (webpack-internal:///781:391:32)
        at Zone.run (webpack-internal:///781:142:43)
        at Object.eval (webpack-internal:///1405:96:38)
        at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (webpack-internal:///1405:126:46)
        at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (webpack-internal:///1405:126:46)
        at eval (webpack-internal:///1405:123:134)
        at ZoneDelegate.invokeTask (webpack-internal:///781:425:31)
        at Zone.runTask (webpack-internal:///781:192:47)
        at drainMicroTaskQueue (webpack-internal:///781:602:35)
业力垫片-

Error.stackTraceLimit = Infinity;
require('core-js/es6');
require('core-js/es7/reflect');
require('zone.js/dist/zone');
require('zone.js/dist/long-stack-trace-zone');
require('zone.js/dist/proxy');
require('zone.js/dist/sync-test');
require('zone.js/dist/jasmine-patch');
require('zone.js/dist/async-test');
require('zone.js/dist/fake-async-test');

// setup angular test bed
var testing = require('@angular/core/testing');
var browser = require('@angular/platform-browser-dynamic/testing');
testing.TestBed.initTestEnvironment(browser.BrowserDynamicTestingModule,                             
browser.platformBrowserDynamicTesting());

// setup app context
var appContext = require.context('./scripts', true, /\.spec\.ts/);
appContext.keys().forEach(appContext);
网页包开发-

// remove common chunks which can cause an issue for unit testing - jsonP
const commonsChunkPluginIndex = commonConfig.plugins.findIndex(plugin => 
plugin.chunkNames);
commonConfig.plugins.splice(commonsChunkPluginIndex, 1);

module.exports = webpackMerge(commonConfig, {
devtool: "cheap-module-eval-source-map",

output: {
    path: helpers.root("wwwroot"),
    filename: "[name].js",
    chunkFilename: "[id].chunk.js"
},

plugins: [
  new ExtractTextPlugin("[name].css")
],

devServer: {
    historyApiFallback: true,
    stats: "minimal"
}
});
网页包通用配置-

module.exports = {
entry: {
    'polyfills': './scripts/polyfills.ts',
    'vendor': './scripts/vendor.ts',
    'app': './scripts/boot.ts'
},

resolve: {
    extensions: ['.ts', '.js']
},

module: {
    rules: [
      {
          test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
          loader: '@ngtools/webpack'
      },
      {
          test: /\.js$/,
          loader: '@angular-devkit/build-optimizer/webpack-loader',
          options: {
            sourceMap: false
          }
      },
      {
          test: /\.html$/,
          loader: 'html-loader',
          query: {
              interpolate: 'require'
          }
      },
      {
          test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
          use: [
              {
                  loader: 'url-loader',
                  options: {
                      limit: 100000
                  }
              }
          ]
      },
      {
          test: /\.scss$/,
          loaders: ['style-loader', 'css-loader', 'resolve-url-loader', 'sass-loader?sourceMap']
      },
      {
          test: /\.css$/,
          exclude: helpers.root('scripts', 'Components'),
          loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader?sourceMap' })
      },
      {
          test: /\.css$/,
          include: helpers.root('scripts', 'Components'),
          loader: 'raw-loader'
      }
    ]
},

plugins: [
    new webpack.optimize.CommonsChunkPlugin({
        name: ['app', 'vendor', 'polyfills']
    }),

    new HtmlWebpackPlugin({
        template: './wwwroot/index.html'
    }),

    new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        "window.jQuery": "jquery"
    }),

    new PurifyPlugin(),

    new AotPlugin({
        tsConfigPath: './tsconfig.json',
        entryModule: './scripts/app.module#AppModule',
        mainPath: './scripts/boot.ts',
        sourceMap: true
    })
]
};
Boot.ts,因为它是唯一包含与BrowserDynamicTestingModule相关内容的其他文件-

import { enableProdMode }           from "@angular/core";
import { platformBrowserDynamic }   from "@angular/platform-browser-dynamic";
import { AppModule }                from "./app.module";
import { isProd, isCordova }        from "../globalFn";

if (isProd()) {
    enableProdMode();
}

// mobile app (TODO) must wait for the device to be ready before starting up
if (isCordova()) {
    document.addEventListener("deviceready", () => {
        platformBrowserDynamic().bootstrapModule(AppModule);
    }, false);
}
else {
    platformBrowserDynamic().bootstrapModule(AppModule);
}
我目前正在运行Angular AOT 5.2.0。我尝试过恢复到JIT构建,但得到了相同的错误。我已经在这上面停留了一段时间了,如果能提供任何帮助或洞察是什么导致了这一切,我们将不胜感激


我可以正常编译和运行构建

我放弃了让AOT工作,也许有人知道这是否可行。我只是完全求助于JIT构建进行测试。JIT构建之前无法工作,因为Aweasome ts loader已更新。

在karma测试时,我也遇到了Angular AOT问题,我必须在webpack配置中切换到JIT进行测试(AngularWebpackPlugin.jitMode:true)
module.exports = {
entry: {
    'polyfills': './scripts/polyfills.ts',
    'vendor': './scripts/vendor.ts',
    'app': './scripts/boot.ts'
},

resolve: {
    extensions: ['.ts', '.js']
},

module: {
    rules: [
      {
          test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/,
          loader: '@ngtools/webpack'
      },
      {
          test: /\.js$/,
          loader: '@angular-devkit/build-optimizer/webpack-loader',
          options: {
            sourceMap: false
          }
      },
      {
          test: /\.html$/,
          loader: 'html-loader',
          query: {
              interpolate: 'require'
          }
      },
      {
          test: /\.(png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/,
          use: [
              {
                  loader: 'url-loader',
                  options: {
                      limit: 100000
                  }
              }
          ]
      },
      {
          test: /\.scss$/,
          loaders: ['style-loader', 'css-loader', 'resolve-url-loader', 'sass-loader?sourceMap']
      },
      {
          test: /\.css$/,
          exclude: helpers.root('scripts', 'Components'),
          loader: ExtractTextPlugin.extract({ fallback: 'style-loader', use: 'css-loader?sourceMap' })
      },
      {
          test: /\.css$/,
          include: helpers.root('scripts', 'Components'),
          loader: 'raw-loader'
      }
    ]
},

plugins: [
    new webpack.optimize.CommonsChunkPlugin({
        name: ['app', 'vendor', 'polyfills']
    }),

    new HtmlWebpackPlugin({
        template: './wwwroot/index.html'
    }),

    new webpack.ProvidePlugin({
        $: 'jquery',
        jQuery: 'jquery',
        "window.jQuery": "jquery"
    }),

    new PurifyPlugin(),

    new AotPlugin({
        tsConfigPath: './tsconfig.json',
        entryModule: './scripts/app.module#AppModule',
        mainPath: './scripts/boot.ts',
        sourceMap: true
    })
]
};
import { enableProdMode }           from "@angular/core";
import { platformBrowserDynamic }   from "@angular/platform-browser-dynamic";
import { AppModule }                from "./app.module";
import { isProd, isCordova }        from "../globalFn";

if (isProd()) {
    enableProdMode();
}

// mobile app (TODO) must wait for the device to be ready before starting up
if (isCordova()) {
    document.addEventListener("deviceready", () => {
        platformBrowserDynamic().bootstrapModule(AppModule);
    }, false);
}
else {
    platformBrowserDynamic().bootstrapModule(AppModule);
}