我刚刚注意到,当我检查Chrome或Firefox开发工具中的任何元素时,分配给该元素的属性始终指向同一行,这是要么结束源文件(当我打开静态index.html时),或者,如果我按webpack-dev-server
运行我的应用,文件的开头。
我的webpack.config.js
:
var webpack = require('webpack');
var autoprefixer = require('autoprefixer');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = {
devtool: 'source-map',
module: {
loaders: [
{
test: /\.(png|woff|woff2|eot|ttf|svg)$/,
loader: 'url-loader?limit=100000'
},
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract({
loader: ['css-loader?sourceMap', 'postcss-loader', 'sass-loader?sourceMap']
})
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
loader: ['css-loader?sourceMap']
})
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015']
}
}
]
},
entry: [
'webpack-dev-server/client?http://localhost:8080',
'webpack/hot/only-dev-server',
'./app/static/js/app.js'
],
output: {
filename: './app/dist/js/bundle.js',
//publicPath: './', // adding back will break webpack-dev-server!
},
watch: false,
plugins: [
new ExtractTextPlugin('./app/dist/css/main.css'),
new webpack.HotModuleReplacementPlugin()
],
devServer: {
host: 'localhost',
//hot: true, // adding back will break webpack-dev-server!
port: 8080,
inline: true,
stats: '_errors-only',
contentBase: './'
}
};
我的package.json
:
{
"name": "new-admin",
"version": "1.0.0",
"description": "",
"main": "0.44132ff81411f73136a6.hot-update.js",
"dependencies": {
"autoprefixer": "^6.5.3",
"bootstrap-loader": "^2.0.0-beta.15",
"bootstrap": "^3.3.7",
"css-loader": "^0.26.0",
"file-loader": "^0.9.0",
"jquery": "^3.1.1",
"postcss": "^5.2.5",
"postcss-loader": "^1.1.1",
"sass-loader": "^4.0.2",
"url-loader": "^0.5.7",
"webpack-dev-server": "^1.16.2",
"webpack-uglify-js-plugin": "^1.1.9"
},
"devDependencies": {
"postcss-load-config": "^1.0.0",
"postcss-loader": "^1.1.1"
},
"scripts": {},
"author": "",
"license": "ISC"
}