1 WARNING in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)

Viewed 43204

How can I solve this warning when creating laravel project?

1 WARNING in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)

Steps to replicate:

  1. composer create-project --prefer-dist laravel/laravel example
  2. cd example
  3. composer require laravel/ui
  4. php artisan ui vue --auth
  5. npm install vue@next vue-router@next vue-loader@next
  6. npm install
  7. npm run dev

EDIT

From this solution, add these lines to webpack.mix.js

mix.webpackConfig({
    stats: {
        children: true,
    },
});

The above solution creates another warning:

WARNING in ./resources/sass/app.scss (./node_modules/css-loader/dist/cjs.js??clonedRuleSet-6.use1!./node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-6.use[2]!./node_modules/resolve-url-loader/index.js??clonedRuleSet-6.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-6.use[4]!./resources/sass/app.scss) Module Warning (from ./node_modules/postcss-loader/dist/cjs.js): Warning

(2423:3) autoprefixer: Replace color-adjust to print-color-adjust. The color-adjust shorthand is currently deprecated.

Child mini-css-extract-plugin C:\xampp\htdocs\lva\node_modules\css-loader\dist\cjs.js??clonedRuleSet-6.use1!C:\xampp\htdocs\lva\node_modules\postcss-loader\dist\cjs.js??clonedRuleSet-6.use[2]!C:\xampp\htdocs\lva\node_modules\resolve-url-loader\index.js??clonedRuleSet-6.use[3]!C:\xampp\htdocs\lva\node_modules\sass-loader\dist\cjs.js??clonedRuleSet-6.use[4]!C:\xampp\htdocs\lva\resources\sass\app.scss compiled with 1 warning webpack compiled with 1 warning

How can I solve this?

6 Answers

The color-adjust shorthand is currently deprecated and it depends on the autoprefixer@10.4.6 (source).

I was able to fix this by reverting the autoprefixer package as well as @Benno to version 10.4.5. Run this:

npm install autoprefixer@10.4.5 --save-exact

You probably updated your npm packages. I was able to fix this by reverting the autoprefixer package to version 10.4.5 in the package-lock.json.

when you have problem with autoprefixer maybe because your version autoprefixer. you can add version autoprefixer based problem this version autoprefixer . i have problem on "print-color-adjust" and i add code on my package.json for change my autoprefixer become version "10.4.5"

when you use npm

    "overrides": {
      "autoprefixer": "10.4.5"
     },

Or, when you use yarn

    "resolutions": {
      "autoprefixer": "10.4.5"
    },

Don't forget to delete your package-lock and node_modules , then npm install again. it work for me (react-bootstrap.v.5)

If you don't want to add additional packages to solve this error, then try this:

Capitalize all the files and Directory name in your components folder

Or you can run this command to install a package if the above solution doesn't work.

npm install autoprefixer@10.4.5 --save-exact

I'm using React with InertiaJS and Laravel as backend, this solution worked in my case. Thanks

I have the same problem, whenever I hit save an annoying pop-up of error code comes. The simple solution is to add the following code to your webpack.mixjs file :

mix.webpackConfig({
stats: {
    children: true,
},});

stop the npm run watch

add a package autoprefixer, add below in terminal:

npm install autoprefixer@10.4.5 --save-exact

run npm run watch and it will not give the error again.

I solved this issue within Laravel by changing the file ./node_modules/bootstrap/scss/forms/_form-check.scss

Line 28 part of the .form-check-input style change color-adjust: exact; // Keep themed appearance for print to print-color-adjust: exact; // Keep themed appearance for print

Related