Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Webpack slow config
module.exports = env => {
const config = {
devServer: {
hot: true,
inline: true,
headers: { 'Access-Control-Allow-Origin': '*' },
port: 8080,
host: 'localhost',
},
entry: {
app: ['./resources/assets/js/app.js', './resources/assets/sass/app.scss'],
},
plugins: [
new ProgressBarPlugin(),
new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin(),
],
output: {
filename: 'js/[name].js',
path: path.resolve(__dirname, 'public/js/'),
publicPath: '/'
},
module: {
rules: [
{
test: /\.(png|jpg|jpeg|gif|eot|ttf|woff|woff2|svg|svgz)(\?.+)?$/,
exclude: /favicon\.png$/,
use: [{
loader: 'url-loader',
options: {
name: path.resolve(__dirname, 'public/css')
}
}]
},
{
test: /\.scss$/,
exclude: /(node_modules)/,
use: ['css-hot-loader'].concat(ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader?url=false', 'postcss-loader', 'sass-loader'],
})),
},
{
test: /\.css$/,
use: ['css-hot-loader'].concat(ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader']
})),
},
{
test: /\.js$/,
exclude: /(node_modules)/,
loader: 'babel-loader',
},
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
'scss': 'vue-style-loader!css-loader!sass-loader',
'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
}
}
},
]
},
resolve: {
extensions: ['.js'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
}
},
};
if (process.env.NODE_ENV === 'production') {
config.watch = false;
}
if (env.server) {
config.plugins.push(new ExtractTextPlugin('css/[name].css'));
} else {
config.plugins.push(new ExtractTextPlugin('../css/[name].css'));
}
return config;
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment