2016-02-03 37 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有關。也許給一個鏡頭,看看你是否得到可用的地圖?