sireno-grid/webpack.config.js

A lightweight CSS Grid system based on CSS Grid Layout with flexbox fallback for unsupported browsers.

const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");


module.exports = {
  entry: {
    "sireno-grid": "./src/sireno-grid.scss"
  },
  output: {
    path: path.resolve(__dirname, "dist"),
    publicPath: "/dist"
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: "[name].css",
    }),
  ],
  optimization: {
    splitChunks: {
      cacheGroups: {
        js: {
          test: /\.js$/,
          name: "commons",
          chunks: "all",
          minChunks: 7,
        },
        css: {
          test: /\.(css|sass|scss)$/,
          name: "commons",
          chunks: "all",
          minChunks: 2,
        }
      }
    }
  },
  module: {
    rules: [{
      test: /\.(css|sass|scss)$/,
      use: [
        MiniCssExtractPlugin.loader,
        {
          loader: 'css-loader',
          options: {
            importLoaders: 2,
            sourceMap: true
          }
        },
        {
          loader: 'postcss-loader',
          options: {
            plugins: () => [
              require('autoprefixer')
            ],
            sourceMap: true
          }
        },
        {
          loader: 'sass-loader',
          options: {
            implementation: require("sass"),
            sourceMap: true
          }
        }
      ],
    }]
  }
}