1

我正在开发一个 Angular2 应用程序。我浏览了文档并实施了 AOT 和汇总。我在应用程序中有一些非 es6 模块。汇总后，我在 webpack 的帮助下捆绑了 js，用所需的库代码替换“require”语句。我在每一步都生成了 sourceMap。但是，当控制台中出现错误时，它并没有反映正确的行。以下是我的 aot、rollup 和 webpack 配置。'sourceMap' 选项在每个配置中设置为 'true'。请指教。

tsconfig.aot.js 

{
  "compilerOptions": {
    "target": "es5",
    "module": "es2015",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "allowUnreachableCode": true,
    "suppressImplicitAnyIndexErrors": true,
    "allowSyntheticDefaultImports": true
  },
  "angularCompilerOptions": {
    "genDir": "aot",
    "skipMetadataEmit" : true
  },
  "compileOnSave": false,
  "files": [
    "scripts/app.module.ts",
    "scripts/main.ts"
  ],
  "exclude": [
    "node_modules",
    "dist"
  ]
}

汇总.ts

export default {
    entry: 'scripts/main.js',
    dest: 'build/app.js', // output a single application bundle
    sourceMap: true,
    format: 'iife',
    context: 'this',
    plugins: [

        nodeResolve(
            {
                jsnext: true,
                module: true,
            }
        ),
        commonjs({
            include: 'node_modules/**/**',
        })  ,

    ]
}

最后是 Webpack

插件：[

//Does type checking in a separate process, so webpack don't need to wait.
new ForkCheckerPlugin(),
new ExtractTextPlugin("styles/[name].css"),

//Varies the distribution of the ids to get the smallest id length for often used ids.
new webpack.optimize.OccurenceOrderPlugin(true),

//Copy files and directories in webpack. Copies project static assets.
new CopyWebpackPlugin([{
  from: root('assets'),
  to: root('build/assets')
}]),

    new webpack.optimize.DedupePlugin(),

    new webpack.optimize.UglifyJsPlugin({sourceMap: true}),

    new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /de|it/)

],

4

0 回答 0