Laravel-mix: Relative modules were not found in Laravel-Mix 1.4.3

[ruchern-chong]

• Laravel Mix Version: 1.4.3 (npm list --depth=0)
• Node Version (node -v): 8.5.0
• NPM Version (npm -v): 5.4.2
• OS: macOS 10.12.6 / Ubuntu 17.04

Description:

ERROR  Failed to compile with 5 errors                                                                                                                                      
These relative modules were not found:

* ./components/Avatar.vue in ./resources/assets/js/frontend.js
* ./components/backend/FooterComponent.vue in ./resources/assets/js/backend.js
* ./components/passport/AuthorizedClients.vue in ./resources/assets/js/backend.js
* ./components/passport/Clients.vue in ./resources/assets/js/backend.js
* ./components/passport/PersonalAccessTokens.vue in ./resources/assets/js/backend.js

This error is not seen in Laravel Mix 1.4.2.

Steps To Reproduce:

Running the command npm run production or yarn production results in the build failing on Laravel Mix 1.4.3.

[yabasha]

I'm facing similar issue but with more relative modules 12.

Ubuntu 16.04 64bit

[ruchern-chong]

Issue resolved with 8a498f86f315b17d992af376e17db5e9857f32c1 in v1.4.4.

[jasecara]

I'm still experiencing the same error, I've updated to laravel-mix 1.4.5. I've done all the usual steps, delete node_modules, fresh yarn install, etc. But if I run yarn production, I'll still get the same error:

ERROR Failed to compile with 28 errors
These relative modules were not found

It looks like its all of the vue components I define in app.js.

Any ideas? Has anyone had a temp fix that has worked?
@ruchern @yabasha

[ruchern-chong]

@jasecara I think the vue-loader changes from 1.4.4 to 1.4.5 caused the problem.

I suspect this 81848760705f5ce009ab00763a1bd92d98af381b is causing the issue.

Try setting that value to true.

[jasecara]

@ruchern Sadly that did not work :-(. I dumped everything in node_modules again, cleared cache, and then modified my mix file to include setting esModule to true like so:

mix.js('resources/assets/js/app.js', 'public/js') .sass('resources/assets/sass/app.scss', 'public/css').options({ processCssUrls: false }) .copyDirectory('resources/assets/images', 'public/img') .webpackConfig({ plugins: usePlugins, }) .options({ vue: { esModule: true } });

But I'm still getting the same error as before ("These relative modules were not found").

[yansern]

@jasecara The current version 1.4.5 does have the esModule: true option yet.

The pull request for configurable esModule has just been accepted 2 hours ago. 1.4.6 will have it, it depends on how soon @JeffreyWay gets it out. See: https://github.com/JeffreyWay/laravel-mix/pull/1211

For now, my suggestion to you is to manually modify the file node_modules/laravel-mix/src/builder/webpack-rules.js as seen in the commit https://github.com/JeffreyWay/laravel-mix/pull/1211/commits/a7d879b692ca9fb84a194cef3b96d9644bce258c and it should work.

[joshlewis]

I'm experiencing these errors with 1.4.5 as well, and changing esModule to Config.vue.esModule did not resolve the issue.

[yansern]

@joshlewis For immediate fix, you can either:

(Option 1) Modify the files as seen in https://github.com/JeffreyWay/laravel-mix/commit/a7d879b692ca9fb84a194cef3b96d9644bce258c

-OR-

(Option 2) Change your package.json file from "laravel-mix": "^1.4.5" to "laravel-mix": "yansern/laravel-mix" then run npm update (but remember to change it back once 1.4.6 is released).

Then, in your webpack.mix.js file, add the following:

mix.options({
  vue: {
    esModule: true
  }
});

Then, it will work.

[joshlewis]

Well, I don't know what the deal was, but I eventually got it to work with this. It didn't initially work, so I had to completely delete my node_modules folder. I then tried doing yarn install with yarn 1.1.0 and running yarn run dev after that still gave me the same error.

Then I decided to delete node_modules again and do npm install instead (with npm 5.3.0), and then npm run dev and that worked. Now yarn run dev works too. I have no idea why or how that happened.

[CalebJTSmith]

Same as @joshlewis - npm install && npm run dev worked perfectly. Installing through yarn was a a failure.

[IvanBernatovic]

We have this issue for a few weeks and it's causing us a pain cause we use Yarn on server in automatic script. Basically it happens only if you install dependencies with Yarn, if you use npm directly then everything works. Oh, I also noticed that everything works fine if you're using Yarn 0.27.5. From 1.0 it doesn't work anymore. So it may be issue completely caused by Yarn. Unfortunately my knowledge about NPM, Yarn and whole tooling story is very basic so I don't know what to do.

[ruchern-chong]

@IvanBernatovic I am using yarn 1.1.0 and I cannot reproduce the problems you have faced.

[iraklisg]

@ruchern I am facing the same problem using [email protected] and yarn 1.1.0. As @joshlewis noted, removing node_modules and then running npm install && npm run dev results in no errors

[Stetzon]

Same problems/solution as @joshlewis noted running [email protected] and yarn v1.2.0

[ruchern-chong]

The reason why deleting node_modules will sometime fix the problem because it will remove any possible residue left inside them or broken packages.

[IvanBernatovic]

@ruchern But in our case deleting node_modules doesn't help, only solution is to install dependencies with npm install and running npm run dev. When we install dependencies with yarn install then npm run dev and yarn run dev don't work. So far with Yarn version from 1.0 to 1.2 (latest stable) building fails, with 0.27.5 it works. If you want I can find out exact Yarn version when building assets started to fail?

[ruchern-chong]

@IvanBernatovic Yes, of course. After deleting node_modules you have to install the packages either using npm install or yarn. I am currently using yarn because since npm v5, packages and their dependencies are broken, partly due to different integrity hashes on different OS. See https://github.com/npm/npm/issues/17929

And I have been using Yarn 1.1.0 since Laravel Mix 1.4.5 and this problem no longer exists (at least for me). I had closed this issue for that reason.

[joshlewis]

The problem still exists. All these people above, including me, have tried to re-install with yarn and yarn run dev no longer works if they do. It only works with npm. This issue shouldn't be closed just because you can't reproduce the problem.

[ruchern-chong]

Let's get @JeffreyWay way in for this. He will be the best person to solve this issue.

[yaayes]

@IvanBernatovic, @ruchern if you still facing this problem, try to check if there are no warnings with yarn check, and upgrade vue-* dependencies.

[ruchern-chong]

@xmoroccan i actually do not have this problem now.

[Stetzon]

Problem is gone for me as well

[IvanBernatovic]

For me problem resolved after I updated vue and vue-template-compiler to latest version (as of now that is 2.5.2) and Yarn too (1.2.1).