1

我有以下配置：

业力.conf.js

var webpack = require('./webpack/webpack.dev');
var port = process.env['KARMA_PORT'] || '9876';

module.exports = (config) => {
  config.set({
    basePath: '',
    frameworks: ['modules', 'jasmine'],
    files: [
      'src/**/*.ts'
    ],
    exclude: [],
    preprocessors: {
      'src/**/*.ts': ['webpack', 'sourcemap']
    },
    webpack: webpack,

webpack.dev.js

devtool: 'inline-source-map',
plugins: [
    new webpack.SourceMapDevToolPlugin({
        filename: null, // if no value is provided the sourcemap is inlined
        test: /\.(ts|js)($|\?)/i // process .js and .ts files only
    })
],
loaders: [{
    test: /\.ts$/,
    include: path.resolve('./src'),
    exclude: /node_modules/,
    use: [
        'awesome-typescript-loader'            
    ]
},

tsconfig.json

{
  "awesomeTypescriptLoaderOptions": {
    "forkChecker": true,
    "useWebpackText": true,
    "transpileOnly": false
  },
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "inlineSourceMap": true,
    "sourceMap": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "lib": [
      "dom",
      "es2015"
    ],
    "types" : [
      "jquery",
      "jasmine",
      "angular-mocks",
      "angular-animate",
      "node"
    ],
    "typeRoots": [
      "node_modules/@types",
      "./node_modules",
      "./typings/global.d.ts"      
    ]
  },
  "files": [
    "typings/global.d.ts",
    "src/some/index.ts"
  ],
  "include": [
    "./typings/**/*.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}

有了这个配置覆盖，它可以正常工作：remap-instabul 正确地重新映射代码但是当我尝试在 Chrome 中调试单元测试时 - 源映射被破坏了。如果我在 tsconfig.json 中设置 sourceMaps: true 和 inlineSourceMaps: false - 源地图在 Chrome 中可以正常工作，但覆盖范围会被破坏:(

为了使源映射在单元测试和覆盖范围内都工作，正确的配置是什么？

4

0 回答 0