laravel-mix: Dependencies not found error references my own files

  • Laravel Mix Version: +-- laravel-mix@1.1.1
  • Node Version: v8.1.3
  • NPM Version: 5.2.0
  • OS: Windows 10

npm list --depth=0 does give me an error though (even when manually installing webpack):

`-- webpack@2.2.0

npm ERR! peer dep missing: webpack@^2.2.0, required by extract-text-webpack-plugin@2.1.2

Complete list:

+-- axios@0.15.3
+-- bootstrap-sass@3.3.7
+-- cropperjs@1.0.0-rc.3
+-- cross-env@5.0.1
+-- flatpickr@2.6.3
+-- jquery@3.2.1
+-- jquery-mousewheel@3.1.13
+-- laravel-mix@1.1.1
+-- lodash@4.17.4
+-- malihu-custom-scrollbar-plugin@3.1.5
+-- nouislider@9.2.0
+-- owl.carousel@2.2.0
+-- tinymce@4.6.4
+-- vue@2.3.4
`-- webpack@2.2.0

npm ERR! peer dep missing: webpack@^2.2.0, required by extract-text-webpack-plugin@2.1.2

Description:

Since updating laravel-mix and npm I receive the following error:

These dependencies were not found:

* C:\Projects\project-name\resources\assets\js\cms\cms.js in multi ./resources/assets/js/cms/cms.js ./resources/assets/sass/cms/cms.scss ./resources/assets/sass/website/style.scss
* C:\Projects\project-name\resources\assets\js\website\website.js in multi ./resources/assets/js/website/website.js
* C:\Projects\project-name\resources\assets\sass\cms\cms.scss in multi ./resources/assets/js/cms/cms.js ./resources/assets/sass/cms/cms.scss ./resources/assets/sass/website/style.scss
* C:\Projects\project-name\resources\assets\sass\website\style.scss in multi ./resources/assets/js/cms/cms.js ./resources/assets/sass/cms/cms.scss ./resources/assets/sass/website/style.scss

To install them, you can run: npm install --save C:\Projects\project-name\resources\assets\js\cms\cms.js C:\Projects\project-name\resources\assets\js\website\website.js C:\Projects\project-name\resources\assets\sass\cms\cms.scss C:\Projects\project-name\resources\assets\sass\website\style.scss

So I tried reverting the update back but the error does not go away. When I empty to files to // the error still occurs. Only when removing the mix entries the error goes away.

My webpack.mix.js file:

const {mix} = require('laravel-mix');

mix.disableNotifications();

mix.options({
    processCssUrls: false
});

mix.js('resources/assets/js/cms/cms.js', 'public/build/js/cms.js')
    .js('resources/assets/js/website/website.js', 'public/build/js/website.js')
    .sass('resources/assets/sass/cms/cms.scss', 'public/build/css/cms.css')
    .sass('resources/assets/sass/website/style.scss', 'public/build/css/website.css');

if (mix.inProduction()) {
    mix.version();
}

The following scripts gives me that error:

npm run dev
npm run prod
npm run watch

My package.json:

{
	"private": true,
	"scripts": {
		"dev": "npm run development",
		"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
		"watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
		"watch-poll": "npm run watch -- --watch-poll",
		"hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
		"prod": "npm run production",
		"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
	},
	"devDependencies": {
		"cross-env": "^5.0.1",
		"laravel-mix": "^1.1.1",
		"webpack": "2.2.0"
	},
	"dependencies": {
		"axios": "^0.15.2",
		"bootstrap-sass": "^3.3.7",
		"cropperjs": "^1.0.0-beta.2",
		"flatpickr": "^2.3.7",
		"jquery": "^3.1.0",
		"jquery-mousewheel": "^3.1.13",
		"lodash": "^4.16.2",
		"malihu-custom-scrollbar-plugin": "^3.1.5",
		"nouislider": "^9.2.0",
		"owl.carousel": "^2.2.0",
		"tinymce": "^4.6.4",
		"vue": "^2.0.1"
	},
	"eslintConfig": {
		"extends": "eslint:recommended",
		"parserOptions": {
			"ecmaVersion": 6,
			"sourceType": "module"
		},
		"env": {
			"browser": true,
			"node": true
		},
		"globals": {
			"_": true,
			"axios": true
		}
	}
}

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 9
  • Comments: 52 (1 by maintainers)

Most upvoted comments

So the easiest fix for now is to downgrade to npm@5.1.0 using

npm i -g npm@5.1.0

Then cleanup and reinstall dependencies:

npm cache clean -f
rm -rf node_modules/ package-lock.json
npm i

I had the same issue using laravel-mix on a non Laravel project. Running npm install --save-dev babel-loader babel-core babel-preset-env webpack fixed the issue for me.

Ok, I’ve just solved this. The paths were wrong, they should in Laravel 5.5 be mix.js('resources/assets/js/app.js', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css');

The loaders (babel-loader, sass-loader, vue-loader, …) are required to work! If they’d be manually installed it works:

npm i --save-dev babel-loader sass-loader vue-loader

I tried npm i --save-dev babel-core babel-loader babel-preset-env sass-loader and still didn’t work. I think it has something with npm 5.2.0 version.

same issue, switch to yarn and it’s fixed.

same problem node v8.4.0 npm v5.3.0 laravel v5.4.33

npm i --save-dev babel-loader sass-loader vue-loader solved it for me.

This seems to be fixed for me with npm 5.3.0, after doing a clean and reinstall as per https://github.com/JeffreyWay/laravel-mix/issues/983#issuecomment-314473998

I’ve just pushed Mix 1.2.0, which bumps the extract-text dependency. Can someone update and let me know if that fixes the issue?

You all shouldn’t need to manually install any of those packages you’re listing.

Confirmed - Latest npm w/ clean reinstall from https://github.com/JeffreyWay/laravel-mix/issues/983#issuecomment-314473998 solved my issues.

This seems to be an error with npm 5.2.0, just downgrade back to 5.1.0 and it should work.

So this command should fix it: npm i --save-dev babel-loader sass-loader vue-loader

Also my package.json for reference:

{
  "private": true,
  "scripts": {
    "dev": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-prod": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-poll": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --watch-poll --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.16.2",
    "babel-loader": "^7.1.1",
    "bootstrap": "^4.0.0-alpha.6",
    "cross-env": "^5.0.1",
    "jquery": "^3.2.1",
    "laravel-mix": "^1.1.1",
    "lodash": "^4.17.4",
    "sass-loader": "^6.0.6",
    "vue": "^2.3.4",
    "vue-loader": "^13.0.1"
  }
}