2016-02-03 34 views
0

我正在开发的一个项目是使用Webpack的代码分割工具。实际上,我无法获得源地图来处理它。我在其他不使用代码拆分的项目上成功地使用了源映射,并怀疑这是否是问题。 gulp task的输出表明源地图确实正在创建 - 它们似乎并不在Chrome中可用。带有chunkFileName和源地图的Webpack

这是我的大嘴文件的相关部分。

files = globule.find(['./src/Components/*.*', '!./src/**/*-test.js']); gulp.src(files) .pipe(webpack({ entry: "./src/components/settings.js", output: { filename: 'Settings.js', publicPath: "/admin/Content/Scripts/apps/", chunkFilename: "[name].js" }, module: { loaders: [{ test: /\.js$/, exclude: /(node_modules)/, loader: 'babel-loader' },{ test: /\.json$/, loader: 'json-loader' },{ test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') }] }, devtool: 'source-map', resolve: { extensions: ['', '.js', '.jsx', '.json'], alias: { 'reactuifw': process.env.NODE_ENV === 'development' ? process.env.REACT_UIFW + 'react-uifw.js' : 'react-uifw', 'react' : __dirname + '/node_modules/react' } }, externals: { jquery: '$' }, cache: true, plugins: [new ExtractTextPlugin('bundle.css')] }))

任何想法什么是错?

回答

0

我从来没有得到正确的源地图与devtool工作:'源地图';我想也许这是SourceMapDevToolPlugin?的特定配置的简写,我明确使用该插件,而不是使用'devtool'选项,配置如this github issue(忽略WebStorm的东西)中所述。这个问题与地图中使用的sourceRoot有关。也许给一个镜头,看看你是否得到可用的地图?