Laravel mix error in lines scss coments

• Laravel Mix Version: 6.0.25
• Node Version 16.3.0
• NPM Version 7.20.0
• OS: Windows 11 Home

I’m trying use laravel-mix a no Laravel project.

Running the “npx mix” return a error in lines comments on .css files.

"dependencies": {
    "@popperjs/core": "2.9.2",
    "bootstrap": "5.0.2",
    "cross-env": "7.0.3",
    "laravel-mix": "6.0.25",
    "webpack": "5.45.1"
  },
  "devDependencies": {
    "resolve-url-loader": "^4.0.0",
    "sass": "^1.35.2",
    "sass-loader": "^12.1.0"
  }

[thecrypticace]

gah this is really aggravating that we have to do this but it makes sense. I’ll see if I can go through and update things tonight and get a release out soon

[ankurk91]

This is happening due to npm v7.x, which auto installs peer dependency listed in vue-loader/package.json

• Laravel mix requires css-loader v5
• but vue-loader install css-loader v6 through peer-dependency

Larave mix should load webpack loaders like this -

 {
      loader: require.resolve('css-loader'),
      options: {
        modules: false,
        esModule: true,
        importLoaders: 2,
      }
    },

This will force node to resolve the css-loader child package (in this case v5) which was installed along with the parent package itself.

See how other packages is doing this https://github.com/symfony/webpack-encore/pull/739