本人新手,目前学习webpack和react。遇到的问题是:设置了devtool: 'eval-source-map',但webpack并没有生成jsx的sourcemap。求大神指教,感激不尽!!!
webpack配置
const path = require('path');
const merge = require('webpack-merge');
const NpmInstallPlugin = require('npm-install-webpack-plugin');
const TARGET = process.env.npm_lifecycle_event;
const PATHS = {
app: path.join(__dirname, 'app'),
build: path.join(__dirname, 'build')
};
process.env.BABEL_ENV = TARGET;
//公共部分,设置入口,出口,模块
const common = {
entry: {
app: PATHS.app
},
resolve: {
extensions: ['', '.js', '.jsx']
},
output: {
path: PATHS.build,
filename: 'bundle.js'
},
module: {
loaders: [
{
test: /\.css$/,
loaders: ['style', 'css'],
include: PATHS.app
},
{
test: /\.jsx?$/,
loaders: ['babel?cacheDirectory'],
include: PATHS.app
}
]
}
};
// Default configuration
if(TARGET === 'start' || !TARGET) {
//在公共部分上添加devServer,设置sourcemap
module.exports = merge(common, {
devServer: {
contentBase: PATHS.build,
historyApiFallback: true,
hot: true,
inline: true,
progress: true
},
devtool: 'eval-source-map',
plugins: [
new NpmInstallPlugin({
save: true // --save
})
]
});
}
运行后,只能见到打包后的bundle.js,并没有map文件。运行中也没有提示错误。
求大神指出哪里错了。感激不尽!!!
我也碰到这问题,配置用的是(devtool: "#source-map")。会出现部分文件sourcemap映射出错的问题,偶尔文件映射出错会跟jsx源码中的中文注释有关系。
后来换了个浏览器(原来用的chrome 51版本),换成Firefox去查看.map文件发现没有问题,不知道是不是跟浏览器有关系