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

const cssLoaders = [
  MiniCssExtractPlugin.loader,
  {
    loader: "css-loader",
    options: {
      sourceMap: true,
      importLoaders: 2,
    },
  },
  {
    loader: "postcss-loader",
    options: {
      sourceMap: true,
    },
  },
];

// Pure CSS files: skip sass-loader
const cssRule = {
  test: /\.css$/i,
  use: cssLoaders,
};

// SCSS files: include sass-loader
const scssRule = {
  test: /\.scss$/i,
  use: [
    ...cssLoaders,
    {
      loader: "sass-loader",
      options: {
        sassOptions: {
          includePaths: ["app/javascript"],
        },
        implementation: require("sass"),
        sourceMap: true,
      },
    },
  ],
};

module.exports = [cssRule, scssRule];