From eb3b214064fd3244871942b8fef556b2fcb40cfa Mon Sep 17 00:00:00 2001 From: JB Christy Date: Tue, 5 Feb 2019 10:22:00 -0800 Subject: [PATCH] initial webpack.config.js --- webpack.config.js | 127 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 127 insertions(+) create mode 100644 webpack.config.js diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 000000000..e367e060c --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,127 @@ +const path = require('path'); +const webpack = require('webpack'); +const autoprefixer = require('autoprefixer'); + +const CleanWebpackPlugin = require('clean-webpack-plugin'); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const WebpackAssetsManifest = require("webpack-assets-manifest"); + +const npmPackage = './node_modules/'; + +// for MiniCssExtractPlugin +function recursiveIssuer(m) { + if (m.issuer) { + return recursiveIssuer(m.issuer); + } else if (m.name) { + return m.name; + } else { + return false; + } +} + +module.exports = ( argv ) => { + console.log( 'Mode is ' + argv.mode ); + let assetDir = './core/', + outputDir = 'core/dist', + devMode = argv.mode !== 'production'; + + return { + entry: { + "full": assetDir + "js/decanter.js", + "noMarkup": assetDir + "js/decanter-no-markup.js" + }, + output: { + filename: devMode ? "[name].js" : "[name].[hash].js", + path: path.resolve(__dirname, outputDir + '/js') + }, + optimization: { + splitChunks: { + cacheGroups: { + full: { + name: 'full', + test: (m,c,entry = 'decanter') => m.constructor.name === 'CssModule' && recursiveIssuer(m) === entry, + chunks: 'all', + enforce: true + }, + noMarkup: { + name: 'noMarkup', + test: (m,c,entry = 'decanter-no-markup') => m.constructor.name === 'CssModule' && recursiveIssuer(m) === entry, + chunks: 'all', + enforce: true + } + } + } + }, + module: { + rules: [ + { + test: /\.js$/, + exclude: /node_modules/, + use: { + loader: 'babel-loader', + options: { + presets: ['@babel/preset-env'] + } + } + }, + { + test: /\.s[ac]ss$/, + use: [ + { + loader: MiniCssExtractPlugin.loader, + options: {} + }, + { + loader: 'css-loader', + options: { + sourceMap: true, + url: false + } + }, + { + loader: 'postcss-loader', + options: { + sourceMap: true, + plugins: () => [ + autoprefixer( { + browsers: ['last 2 versions', '> 1%'] + } ) + ] + } + }, + { + loader: 'resolve-url-loader', + options: { + sourceMap: true, + attempts: 10 + } + }, + { + loader: 'sass-loader', + options: { + includePaths: [ + npmPackage + 'bourbon/core' + ], + sourceMap: true + } + } + ] + } + ] + }, + plugins: [ + new CleanWebpackPlugin( [ outputDir ], { + verbose: true + }), + new MiniCssExtractPlugin( { + // Options similar to the same options in webpackOptions.output + // both options are optional + filename: "../css/[name].css", + chunkFilename: "../css/[id].css" + } ), + new WebpackAssetsManifest( { + output: 'assets.json' + } ), + ] + }; +} \ No newline at end of file