var path = require('path') var webpack = require('webpack') var HtmlWebpackPlugin = require('html-webpack-plugin') var FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin') var ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin') function resolve (dir) { return path.join(__dirname, '..', dir) } function cssLoaders (options) { options = options || {} var cssLoader = { loader: 'css-loader', options: { minimize: process.env.NODE_ENV === 'production', sourceMap: options.sourceMap } } // generate loader string to be used with extract text plugin function generateLoaders (loader, loaderOptions) { var loaders = [cssLoader] if (loader) { loaders.push({ loader: loader + '-loader', options: Object.assign({}, loaderOptions, { sourceMap: options.sourceMap }) }) } // Extract CSS when that option is specified // (which is the case during production build) if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: 'vue-style-loader' }) } else { return ['vue-style-loader'].concat(loaders) } } // http://vuejs.github.io/vue-loader/en/configurations/extract-css.html return { css: generateLoaders(), postcss: generateLoaders(), less: generateLoaders('less'), sass: generateLoaders('sass', { indentedSyntax: true }), scss: generateLoaders('sass'), stylus: generateLoaders('stylus'), styl: generateLoaders('stylus') } } module.exports = { entry: { app: ['./src/index.js', './build/dev-client'] }, output: { path: path.resolve(__dirname, 'dist'), filename: '[name].js', chunkFilename: '[name].js', publicPath: '/' }, resolve: { extensions: ['.js', '.vue', '.json'], alias: { '@': resolve('src'), } }, module: { rules: [ { test: /\.vue$/, loader: 'vue-loader', options: { loaders: cssLoaders({ sourceMap: false, extract: false }) } }, { test: /\.js$/, loader: 'babel-loader', include: [resolve('src')] } ] }, devtool: '#cheap-module-eval-source-map', plugins: [ new webpack.DefinePlugin({ 'process.env': { NODE_ENV: '"development"' } }), // https://github.com/glenjamin/webpack-hot-middleware#installation--usage new webpack.HotModuleReplacementPlugin(), new webpack.NoEmitOnErrorsPlugin(), // https://github.com/ampedandwired/html-webpack-plugin new HtmlWebpackPlugin({ filename: 'index.html', template: './vcm/index.html', inject: true }), new ScriptExtHtmlWebpackPlugin({ defer: 'app.js' }), new FriendlyErrorsPlugin() ] }