webpack css loaders working on windows powershel but dont in linux bash

  Kiến thức lập trình

I have a webpack setup that works properly in Windows powershell,
But when trying to build the same in Linux console
It seems that the css loaders are not working properly
However, I’m not sure where to look.

const webpack = require('webpack');
const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CopyPlugin = require("copy-webpack-plugin");

const MomentLocalesPlugin = require('moment-locales-webpack-plugin');


module.exports = {
  mode: 'production',
  watch: true,
  watchOptions: {
    ignored: /node_modules/,
    poll: 1000, // Check for changes every second
  },
  performance: {
    maxEntrypointSize: 1024000,
    maxAssetSize: 1024000
  },

  entry:{
    slick_style:'./node_modules/slick-slider/slick/slick.scss',
    sass_embeded:'./src/js/home.js',
  },
  output:{
    path: path.resolve( __dirname, '../site/'),
    filename:'js/[name].bundle.js',
    chunkFilename:'js/[name].bundle.[id].js',
  },
  externals: {
    jquery: 'jquery',
  },

  plugins: [
    new MiniCssExtractPlugin({
      linkType: "text/css",
      filename: 'css/[name].bundle.css',
      chunkFilename: "css/[name].bundle.[id].css",
    }),
    new MomentLocalesPlugin(),
    new MomentLocalesPlugin({
      localesToKeep: ['es-us'],
    }),

  ],


  module: {
    rules: [
      {
        test: /.s[ac]ss$/i,
        use: [
          // 'style-loader',
          MiniCssExtractPlugin.loader,
          {
            loader: 'css-loader',
            options: {
              url: false,
              sourceMap: true,
            },
          },
          {
            loader: "sass-loader",
            options: {
              // Prefer `dart-sass`
              implementation: require("sass"),
              sourceMap: true,
              // sourceMapContents: false,
              sassOptions: {
                outputStyle: 'compressed',
              },
            },
          },
        ],
        include: path.resolve(__dirname, '/site/'),
      },


    ],
  },
}

and my output looks like the picture enter image description here

is there a practice of webpack config for windows and linux
or something i’m missing in this config

LEAVE A COMMENT