在运行webpack-dev-server时,所有输出中的错误似乎都指向bundle.js中的行号,而不是原始源文件。我如何获取原始源文件的行号? 我正在使用babel处理ES2015 js的webpack。
webpack.config.dev.js
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
devtool: '#source-map',
entry: [
`webpack-dev-server/client?http://${process.env.npm_package_config_host}:${process.env.npm_package_config_port}`,
'webpack/hot/only-dev-server',
'react-hot-loader/patch',
'./src/index.dev'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js'
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new HtmlWebpackPlugin({
template: 'index.html', // Load a custom template
inject: 'body' // Inject all scripts into the body
})
],
module: {
loaders: [{
test: /\.jsx?$/,
loaders: ['babel'],
include: path.join(__dirname, 'src')
}]
}
};
服务器.js
const webpack = require('webpack');
const WebpackDevServer = require('webpack-dev-server');
const config = require('./webpack.config.dev');
const port = process.env.npm_package_config_port || 3000;
const host = process.env.npm_package_config_host || 'localhost';
new WebpackDevServer(webpack(config), {
publicPath: config.output.publicPath,
hot: true,
historyApiFallback: true,
stats: {
colors: true,
chunks: false,
'errors-only': true
}
}).listen(port, host, function (err) {
if (err) {
console.log(err);
}
console.log(`Listening at http://${host}:${port}/`);
});
loader: 'babel-loader',query: { extends: path.join(__dirname, '.babelrc'), retainLines: true }
? - Steffenbabel-loader
,在options
中添加它,如下所示 -{ loader: "babel-loader", options: { retainLines: true, }, }
- air4x