These relative modules were not found:

[williamstar]

when runing dev-server there throw these two Error

ERROR Failed to compile with 2 errors 10:53:28

These relative modules were not found:

• ./build/dev-client in multi ./build/dev-client ./src/main.js
• ./src/main.js in multi ./build/dev-client ./src/main.js

Listening at http://localhost:8080

node-version 6.8.0
window10
i don't modify the webpack default config, it can run the app sometime but mostly throw the error

[fluteweng]

I got the same problem like this:
ERROR Failed to compile with 1 errors
This relative module was not found:

• ./src/main.js in multi ./build/dev-client ./src/main.js

[xerosanyam]

@williamstar how did u solve it ?

[williamstar]

@xerosanyam In my case , I use the vscode and run the app by F5 at the dev-server or node dev-server.js because I want to debugg some detail. But you can run npm run dev to solve this problem, if you want to debugger code may be can use the chrome debugger symbol embed into code.

[10thfloor]

Was this solved? If so can someone post the solution?

[AprilTong]

请问有人解决了这个问题吗
才安装的vue cli利用其搭建项目npm run dev之后就报类似的错

[xerosanyam]

Can someone please post the solution ?

[xerosanyam]

I solved it by updating all the npm packages by:

npm i -g npm-check-updates
npm-check-updates -u
npm install

please commit your package.json before performing above operation

[Huangsrtext]

can someone solve this problem?

[xerosanyam]

The solution I have suggested above doesnt work for you ?

[luickk]

@xerosanyam Doesnt work );

[Huangsrtext]

@xerosanyam The second input is invalid

[Huangsrtext]

@Tzrong 你的问题解决了吗

[luickk]

你会说英语吗？

[Huangsrtext]

@MrGrimod 你是说我？

[luickk]

是的，但谷歌翻译器确实可以中国。因此，不要在意。
对不起。

[Huangsrtext]

@MrGrimod 哈哈 没事 大家能指出问题所在就好

[Xuhengfeng]

These relative modules were not found:
同样的问题大家是怎么解决的?

[Huangsrtext]

@Xuhengfeng 我也一直没找到方法，一直在等

[Huangsrtext]

This relative module was not found:

• ./src/main.js in multi ./build/dev-client ./src/main.js

[paulredmond]

I got this error when I messed up the case of the filename. When I ran this on a build server running Linux (I use Mac for development) it failed because OS X is case-insensitive and Debian is case-sensitive.

[andrey-helldar]

I'm solved by next commands:

npm i -g npm-check-updates
npm-check-updates -u
npm install --no-bin-links
npm update
npm run dev

[hfq-lixiangyang]

i have same problem, but I'm solved by next commands
npm install babel-loader

[rtugeek]

This may cause by project inited in an existing vue-cli project, I dig myself into a hole, lol.
So I remove the project directory and re-create it, everything is working fine!.

[javidrashid]

If you haven't messed up with your webpack config, it is most likely that you have an issue with one of the npm packages. Clean/Verify the npm cache and then run the below commands, thats how I solved this.

npm i -g npm-check-updates
npm-check-updates -u
npm install

[iamdebabrataghosh]

Check the path you are using.

[charlie043]

I'm solved by re-install all modules :)

rm -rf node_modules
npm install

[egno]

1. Check vue-* modules in devDependencies part of your package.json file.
2. Then upgrade your vue-* modules. Example:
   npm i --upgrade --save-dev vue-style-loader
3. Enjoy!

[Dried09]

I have very similar problem. When I do "npm run serve" or "npm run build" I get this on console:

ERROR Failed to compile with 1 errors
This relative module was not found:
*./app.vue in ./src/main.ts

None of solutions suggested above has no any effect.
I alredy tried to checkout previous project commits, update global and local packages, clone and build project on other machines, delete and reinstall packages, delete package-lock.json, create new project via vue cli and add project files on new configuration - and nothing was changed.

Here is my main.ts

import Vue from 'vue';
import App from './app.vue';
import router from './router';
import store from './store';

Vue.config.productionTip = false;

new Vue({
  router,
  store,
  render: (h) => h(App)
}).$mount('#app');

And here App.vue

<template>
  <div id="app" class="container-fluid">
    <header-component></header-component>
    <main id="content" class="content row">
      <transition name="fade">
        <router-view/>
      </transition>
    </main>
    <footer-component></footer-component>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from 'vue-property-decorator';
import HeaderComponent from './components/header/header.component';
import FooterComponent from './components/footer/footer.component';

@Component({
  components: {
    HeaderComponent,
    FooterComponent
  }
})
export default class App extends Vue {}
</script>

<style lang="scss">
@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
@import "../node_modules/font-awesome/css/font-awesome.min.css";
@import "../node_modules/vue2-animate/dist/vue2-animate.min.css";
@import "./styles/main.scss";
</style>

Vue ^2.5.13, project created via vue cli ^3.0.0-beta.6 (also tried beta.15), using Typescript cli plugin ^3.0.0-beta.6

[serdarkaracay]

Hi everyone,
I encountered a very interesting problem.
Here code repository https://github.com/serdarkaracay/starter-node-vue
docker-compose up --build > output

web app response

[udemezue01]

DELETE everything inside these folders:

• node_modules/.cache/babel-loader
• node_modules/.cache/vue-loader

it worked for me

yeah tried it also

[gevinduM]

Had a line I did not enter in my file: import func from '../../vue-temp/vue-editor-bridge';. @bobohuochai suggests VS Code, and that could be. But simply removing it removed the error.

This work for me, Thanks!

[Qiner0900]

help please

This relative module was not found:

• ./Home.vue in ./src/main.js

how did u solve?

[GittyAjay]

check your resources path if it is not in the same folder then use double dot instead of single dot in my case

<img alt='log' src='../assets/logo.png'>
Here image file is present in assets folder which is not in same directory

[MaxmaxmaximusGitHub]

I run everything in the Docker container, and the working folder was not the one with which I registered the files in tsconfig.json; apparently tsconfig.json inclide, trying to get files NOT relative to the location of the tsconfig.json file, but relative to the current WORKING DIRECTORY through which the script is running.

I hope no one forgot to register ts extensions in webpack config? =))

  resolve: {
    extensions: ['.ts', '.tsx', '.js', '.jsx'],
  },

[jasmeetsohal]

Let me answer your question.

All modules and libraries are linked at the time when you run command vue create my-app it will bundle whole package and link as per the config. Now in your case it works well when you run your app inside default template, if you run out of it throws error.
The simple solution for the same is to omit relative path with absolute path .

[mgb389-2]

It seems that I caused this problem because I changed the paths of my imports when I was running my application with npm run serve. This made my cache upset.

I simply stopped the application (Ctrl + c) changed the path back. Ran the application again (npm run serve) and made sure it was back to normal. Stopped the application (ctrl +c), changed my paths and then I ran it again.

In conclusion, do not change any paths when the app is running. You must stop it first and run it again.

The imports look something like this:

<script> import Navbar from '../../components/firstPath/Navbar' </script <script> import Navbar from '../../components/modifiedPath/Navbar' </script

[patrickryan79]

For anyone still reading and realized their issue was slightly different, make sure the case matches what's in the directory.

import somefile from "./path/SomeFile.vue"; 

My app worked flawlessly until I upgraded my tooling. If my file name was somefile.vue or someFile.vue it failed with a similar error.

[patrickjh]

For people still struggling with this you may try specifying the file to serve in package.json. This moved me past this error. I changed:
"serve": "vue-cli-service serve"
to
"serve": "vue-cli-service serve src/main.ts"

I started running into another error at this point, but this at least resolved the "this relative module was not found" error

[Leon-MK]

In my case I simply forgot I was trying to reference the old file in a different component! Most likely human error

[Previesam]

in case you are having the

`This relative module was not found:

• ../vue-temp/vue-editor-bridge in ./node_modules/babel-loader/lib??ref--2-0!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./layouts/default.vue?vue&type=script&lang=js&`

look for import func from '..vue-temp/vue-editor-bridge' in your template and remove it

[neumond]

Somehow, after mounting public & src folders in read-only mode the error disappears. I suspect this is related to fsevents.

[emilhein]

What worked for me, was somehow described above.
Hope it help someone else. Add the following to your vue.config.js:

configureWebpack: {
    entry: {
      app: './src/entry/index.js' // or whatever your entry is
    }
}

[VelizarHristov]

In my case the problem was that it was looking for a main.js file in my code but couldn't find it - instead I had an app.js with the same functionality, so I renamed my app.js to main.js.

[busurmankulov577]

ERROR Failed to compile with 2 errors 13:46:35

These relative modules were not found:

• ./components/TodoList in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/Todos.vue?vue&type=script&lang=js&
• ./components/addTodo in ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/Todos.vue?vue&type=script&lang=js&
  Хелп

[flavio-marchi]

Adjusting the serve script in the package.json solved the issue for me too:
"serve": "vue-cli-service serve resources/js/app.js"

[enversaypr]

I have same problem and I still could not solve that problem. Npm works well on my local but I use Buildkite for git. When buildkite try to do that, it response like this. Do you have any suggestion for that ?

• /var/www/winstag-api/resources/assets/sass/app.scss in multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
  --
    |  
    | To install it, you can run: npm install --save /var/www/winstag-api/resources/assets/sass/app.scss
    |  
    |  
    | These relative modules were not found:
    |  
    | * ./mixins/http-mixin.vue in ./resources/assets/js/app.js
    | * ./components/dashboard-burger-menu.vue in ./resources/assets/js/app.js

[DarthSett]

just solved it after 2 hours
I had the following errors when I tried to run the default app without configuring anything right after I created the project:

These dependencies were not found:

/Users/newuser/Documents/projects/wheel/ProjectName/node_modules/webpack-dev-server/client/index.js?http://10.0.0.4:8080/sockjs-node in multi ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ../ProjectName/node_modules/webpack/hot/dev-server.js ./src/main.js, multi ../ProjectName/node_modules/webpack-dev-server/client?http://localhost ../ProjectName/node_modules/webpack/hot/dev-server.js ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ./src/main.js
/Users/newuser/Documents/projects/wheel/ProjectName/node_modules/webpack-dev-server/client/index.js?http://localhost in multi ../ProjectName/node_modules/webpack-dev-server/client?http://localhost ../ProjectName/node_modules/webpack/hot/dev-server.js ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ./src/main.js
/Users/newuser/Documents/projects/wheel/ProjectName/node_modules/webpack/hot/dev-server.js in multi ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ../ProjectName/node_modules/webpack/hot/dev-server.js ./src/main.js, multi ../ProjectName/node_modules/webpack-dev-server/client?http://localhost ../ProjectName/node_modules/webpack/hot/dev-server.js ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ./src/main.js
To install them, you can run: npm install --save /Users/newuser/Documents/projects/wheel/ProjectName/node_modules/webpack-dev-server/client/index.js?http://10.0.0.4:8080/sockjs-node /Users/newuser/Documents/projects/wheel/ProjectName/node_modules/webpack-dev-server/client/index.js?http://localhost /Users/newuser/Documents/projects/wheel/ProjectName/node_modules/webpack/hot/dev-server.js

This relative module was not found:

./src/main.js in multi ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ../ProjectName/node_modules/webpack/hot/dev-server.js ./src/main.js, multi ../ProjectName/node_modules/webpack-dev-server/client?http://localhost ../ProjectName/node_modules/webpack/hot/dev-server.js ../ProjectName/node_modules/webpack-dev-server/client?http://10.0.0.4:8080/sockjs-node ./src/main.js

In order to fix this, I had to change the names of all the folders in my path to not contain any upper case letters and voila, it fixed it

Hope this helps :)

[partrickJhonson]

Tive esse problema ao tentar importar um componente que estava em um diretirio a um nivel abaixo do diretotio do componente, resolvi passando o caminho completo do componente , exp do erro:import objeto from "./src/servirces/Objeto" solucção: import objeto from "/home/peog-05linux/Desktop/Tp01SD/frontend/src/servirces/Objeto.js"

[william-keller]

In my case, some VS Code extension had added accidentally an import that i don't need.
The import was " import func from 'vue-editor-bridge';"
Just removed it and works perfectly again
I Hope it can help someone

[ShuYiGengYun]

Let me answer your question.

All modules and libraries are linked at the time when you run command vue create my-app it will bundle whole package and link as per the config. Now in your case it works well when you run your app inside default template, if you run out of it throws error. The simple solution for the same is to omit relative path with absolute path .

Let me answer your question.

All modules and libraries are linked at the time when you run command vue create my-app it will bundle whole package and link as per the config. Now in your case it works well when you run your app inside default template, if you run out of it throws error. The simple solution for the same is to omit relative path with absolute path .

thanks it works for me

[AnkitaGupta00]

• ../webfonts/fa-brands-400.eot in ./node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--7-oneOf-1-2!./src/assets/css/all.min.css

the error instructed to install " npm install --save" this module
after installed this I got same error
please help me