Question

嘿，

我正在设置新的Angular 2项目，我正在使用webpack进行捆绑。我想将文件输出到单独的文件夹（公共）。问题是webpack还为每个.ts文件生成.map和.js文件。 我想在输出文件夹中只输入一个.map文件，或者在原始文件以外的其他文件夹中输入所有.map和.js文件。我的代码如下所示：

module.exports = (env) => {
 return webpackMerge(commonConfig(), {
  output: {
    path: BUILD_DIR,
    filename: 'public/js/[name].js',
    chunkFilename: 'public/js/[id].chunk.js',
    sourceMapFilename: 'public/js/[file].map'
  },
  devtool: 'cheap-module-eval-source-map',
  devServer: {
    inline: true,
    contentBase: './public',
    port: 8100,
    historyApiFallback: true,
    stats: 'minimal'
  },
 });
};

基础配置：

module.exports = () => {
  return {
    entry: {
      'polyfills': APP_DIR + '/polyfills.ts',
      'vendor':  APP_DIR + '/vendor.ts',
      'app':  APP_DIR + '/main.ts'
    },
    resolve: {
      extensions: ['.ts', '.js']
    },
    module: {
      rules: [
        {
          test: /\.ts$/,
          loaders: [{
            loader: 'awesome-typescript-loader',
            options: { tsconfig: './tsconfig.json' }
          } , 'angular2-template-loader']
        },
      ]
    },
    plugins: [
      new webpack.optimize.CommonsChunkPlugin({
      name: ['app', 'vendor', 'polyfills']
    }),
    new ExtractTextPlugin({
      allChunks: true,
      filename: 'public/styles/main.css'
    }),
    new HtmlWebpackPlugin({
      template: './src/index.html',
      filename: 'public/index.html'
    })
  ]
}

然后输出变为：

public
  js/bundle.js
  js/vendor.js
  js/polyfills.js
src
  one.component.ts
  one.component.js
  one.component.js.map

注意：不确定webpack是否对此负责，我看到.map和.js文件在保存时生成，尽管webpack甚至没有运行。什么可能触发？

Answer 1

我想我正在寻找错误的地方。它是导致此行为的原子编辑器（或者更准确地说是它的typescript插件）。但至少我想出来并知道这些文件的来源。也许对于那些想知道同样事情并且没有考虑编辑负责的人也有帮助。

隐藏这些文件的几个链接：

Can I hide typescript autogenerated .js and .map.js files in atom?

https://github.com/TypeStrong/atom-typescript/issues/253

Answer 2

据我所知，您的地图文件不是来自Webpack，而是来自TypeScript。如果您根本不想要地图文件，请在tsconfig.json中设置"sourceMap": false,。

如何防止webpack生成.map文件

2 个答案: