Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't compile any Vue project - The relative module was not found ./src/main.ts in multi ./src/main.ts #2934

Open
zmbq opened this issue Nov 12, 2018 · 28 comments

Comments

@zmbq
Copy link

zmbq commented Nov 12, 2018

Version

3.1.1

Reproduction link

https://github.com/zmbq/vue-cli-bug

Node and OS info

10.13.0

Steps to reproduce

I've created a new Vue project with the vue cli, specifying Typescript, Babel, no class decorators, SCSS, tslint and no unit tests. The project is located under c:\sources\test. c:\sources is a directory junction (a Windows equivalent of symlinks) to d:\sources.

Then I did a yarn build

What is expected?

Project should compile

What is actually happening?

ERROR Failed to compile with 1 errors 9:37:35 AM

This relative module was not found:

  • ./src/main.ts in multi ./src/main.ts
    ERROR Build failed with errors.

When working from d:\sources\test everything is working properly. I've been using Vue on the same computer with the same directory junction without an issue.

Angular has a --preserve-symlinks option to make this work, I did not find a Vue counterpart.

@sodatea
Copy link
Member

sodatea commented Nov 12, 2018

Can't reproduce. Here's the screencast: https://asciinema.org/a/us6wLLCaX39COtwXOSmBpIJPo

@sodatea sodatea added the cannot reproduce We cannot reproduce the problem with the given information. More env information needed. label Nov 12, 2018
@zmbq
Copy link
Author

zmbq commented Nov 12, 2018

OK! Got it! This is a problem when using directory junctions in Windows, and it's brand new, since I've been using those for quite a lot of time with Vue. I'm updating the issue.

@zmbq
Copy link
Author

zmbq commented Nov 12, 2018

I have just noticed webpack has been updated from 4.23.1 to 4.25.1, which explains the difference.

This still needs to be fixed, people starting new projects on linked directories (at least on Windows) are going to face this.

@sodatea
Copy link
Member

sodatea commented Nov 12, 2018

Does disabling symlink help? https://webpack.js.org/configuration/resolve/#resolve-symlinks

@sodatea sodatea removed the cannot reproduce We cannot reproduce the problem with the given information. More env information needed. label Nov 12, 2018
@zmbq
Copy link
Author

zmbq commented Nov 12, 2018 via email

@senglory
Copy link

Hi, I am experiencing exactly the same issue. Here is my build log in VS2017:

1>Target CompileTypeScriptWithTSConfig:
1> Skipping target "CompileTypeScriptWithTSConfig" because it has no outputs.
1>Target GenerateTargetFrameworkMonikerAttribute:
1> Skipping target "GenerateTargetFrameworkMonikerAttribute" because all output files are up-to-date with respect to the input files.
1>Target CoreCompile:
1> Using shared compilation with compiler from directory: C:\Program Files (x86)\Microsoft Visual Studio\2017\Enterprise\MSBuild\15.0\Bin\Roslyn
1>Target GetTypeScriptCopyToOutputDirectoryItems:
1> Adding items with BuildAction=TypeScriptCompile to the same collections that will be populated (with items of other BuildActions) by the GetCopyToOutputDirectoryItems target
1>Target CopyFilesToOutputDirectory:
1> Copying file from "obj\Debug\netcoreapp2.2\weatherapp2.dll" to "bin\Debug\netcoreapp2.2\weatherapp2.dll".
1> weatherapp2 -> C:\prj\Demo\NetCoreVueTypeScript2\webapp\weatherapp2\bin\Debug\netcoreapp2.2\weatherapp2.dll
1> Copying file from "obj\Debug\netcoreapp2.2\weatherapp2.pdb" to "bin\Debug\netcoreapp2.2\weatherapp2.pdb".
1>Target DebugRun:
1> v10.14.2
1> Performing first-run NPM RUN SERVE...
1>
1> > weatherapp2@0.0.0 serve C:\prj\Demo\NetCoreVueTypeScript2\webapp\weatherapp2
1> > vue-cli-service serve
1>
1> INFO Starting development server...
1> Starting type checking service...
1> Using 1 worker with 2048MB memory limit
1> ERROR Failed to compile with 1 errors3:39:09 PM
1>
1> This relative module was not found:
1>
1> * ./src/main.ts in multi (webpack)-dev-server/client?http://192.168.231.144:8086/sockjs-node ./node_modules/@vue/cli-service/node_modules/webpack/hot/dev-server.js ./src/main.ts
1> Type checking in progress...
1> No type errors found
1> Version: typescript 3.2.2
1> Time: 9598ms

What should I do to have it fixed?

@DrCord
Copy link

DrCord commented Apr 17, 2019

I am also having this issue. Any solutions?

@biapar
Copy link

biapar commented May 5, 2019

Same issue!!!

@monkeymonk
Copy link

Same here...

@monkeymonk
Copy link

monkeymonk commented May 29, 2019

I just pass through this error by creating a folder named "src" and an empty file named "main.js".
If it helps someone... :-)

@liflovs
Copy link

liflovs commented Sep 28, 2019

The issue for me is more likely with Vui UI. For some reason when i run anything from it - i get these errors:

This relative module was not found:

* ./src/main.ts in multi ./src/main.ts

But when i run same commands manually - they work. Maybe its why this issue has so little attention, but its irritating a lot. Using Mac Os by the way

@ShawLyon
Copy link

ShawLyon commented Nov 6, 2019

The issue for me is more likely with Vui UI. For some reason when i run anything from it - i get these errors:

This relative module was not found:

* ./src/main.ts in multi ./src/main.ts

But when i run same commands manually - they work. Maybe its why this issue has so little attention, but its irritating a lot. Using Mac Os by the way

Me too, Can you solve it?

@MartinDM
Copy link

MartinDM commented Nov 14, 2019

Having this same issue in an automated build pipeline, although works locally. MacOS.

Is this related to symlinks in MacOS?
@monkeymonk, can you describe your solution more fully please? Main.js is already needed as the main file for vue JS though, so how can it be empty?
@liflovs, did you get to resolve this?

@themaxaboy
Copy link

The problem from vue ui
Use the project start with vue create and import into vue ui.

@jdchmiel
Copy link

jdchmiel commented Apr 1, 2020

I had this issue recently setting up a coworker on an existing project. It turned out her machine cared a file was case sensitive and mine does not. A notable difference is she has node 12 and I am still on 10.

@Alam1386
Copy link

I had the same issue (below is the error) and solved it. When importing the CSS file in main.js, add .css extension. It solved the error for me.


ERROR Failed to compile with 1 errors 1:26:47 PM

This relative module was not found:

  • ./assets/Main in ./src/main.js

@yiptsangkin
Copy link

same problem,i create a empty main.ts at src directory,and it fix.

@kordwarshuis
Copy link

-Vue UI
-MacOS.

I used capitals (nameOfProject) and got the “The relative module was not found ” error.
Removed the project and started again, this time I used dashes (name-of-project).
This solved it for me.

@playoutprod
Copy link

-Vue UI
-MacOS.

I used capitals (nameOfProject) and got the “The relative module was not found ” error.
Removed the project and started again, this time I used dashes (name-of-project).
This solved it for me.

Same here, app was launching fine with command and not using vue UI.
Resolve it by checking in the output the name of the folder (start with a capital) and the folder on my drive (without capital).
I just renamed the folder to match the output and it worked.

So I tried this :
Create a new projet using Vue UI named TEST with only capitals : Project folder is written without capitals (test) so it doesn't work :

This relative module was not found:
 ./src/main.js in multi ../TEST/

Two solutions :

  • Rename the folder to match (from 'test to 'TEST')

  • Got to users/yourname/.vue-cli-ui/db.json
    Rename your project folder here

   {
      "id": "MBm-9_Yc-e",
      "path": "/Users/yourname/TEST",  => "path": "/Users/yourname/test"
      "favorite": 0,
      "type": "vue",
      "name": "test",
      "openDate": 1593447232041
    }

Relaunch the ui client.

@yiptsangkin
Copy link

yiptsangkin commented Jun 30, 2020

-Vue UI
-MacOS.
I used capitals (nameOfProject) and got the “The relative module was not found ” error.
Removed the project and started again, this time I used dashes (name-of-project).
This solved it for me.

Same here, app was launching fine with command and not using vue UI.
Resolve it by checking in the output the name of the folder (start with a capital) and the folder on my drive (without capital).
I just renamed the folder to match the output and it worked.

So I tried this :
Create a new projet using Vue UI named TEST with only capitals : Project folder is written without capitals (test) so it doesn't work :

This relative module was not found:
 ./src/main.js in multi ../TEST/

Two solutions :

  • Rename the folder to match (from 'test to 'TEST')
  • Got to users/yourname/.vue-cli-ui/db.json
    Rename your project folder here
   {
      "id": "MBm-9_Yc-e",
      "path": "/Users/yourname/TEST",  => "path": "/Users/yourname/test"
      "favorite": 0,
      "type": "vue",
      "name": "test",
      "openDate": 1593447232041
    }

Relaunch the ui client.

aha, may be you can try my project near-admin-vue, i found that it's my mistake at webpack config finally.

@iwalz
Copy link

iwalz commented Jul 14, 2020

same problem,i create a empty main.ts at src directory,and it fix.

Same here. This seems to be always popping up once in a while looking at this thread. Is there like a clear root cause which could be fixed or is an empty file really considered as a good solution?

@integritek
Copy link

MacOS
No part of the directory can have a space. Fixed it for me.
Documents/Dev/Web Apps/project - failed
Documents/Dev/WebApps/project - compiled

@karatekaneen
Copy link

I ran into a similar issue where build succeeded locally but failed in node Docker image running in CI system remotely.
The problem for me was that I had renamed folders to lowercase locally, i.e. ./src/components/Auth/Login.vue was renamed to ./src/components/auth/Login.vue and the folder name did not update in the git repo. By changing the folder names to something different (auth -> authentication in this case) I forced the change of folder names and the build then started to work.

Hope this helps someone in a similar situation.

@sidkr
Copy link

sidkr commented Sep 5, 2020

I ran into a similar issue where build succeeded locally but failed in node Docker image running in CI system remotely.
The problem for me was that I had renamed folders to lowercase locally, i.e. ./src/components/Auth/Login.vue was renamed to ./src/components/auth/Login.vue and the folder name did not update in the git repo. By changing the folder names to something different (auth -> authentication in this case) I forced the change of folder names and the build then started to work.

Hope this helps someone in a similar situation.

Same issue with me. Resolved after renaming the dir casing.

@buksy90
Copy link

buksy90 commented Mar 28, 2021

I have this issue too, it works locally when running build on Windows 10, but when I run in docker alpine based image it fails....
I have clean project created with "vue create ." (vuex, router, ts, babel) and added vuetify with "vue add vuetify" ... I havent done any changes in code and it fails.

I created demo repository that works locally, but when run in docker (using ./scripts/build) it fails with this error.

https://github.com/buksy90/vue-cli-example-bug

@fangbinwei
Copy link
Collaborator

@buksy90 It's not the bug of CLI. using COPY . . instead of COPY [^package]* ./. If you want to ignore node_modules, you can create .dockerignore

moby/moby#15858

image

@buksy90
Copy link

buksy90 commented Mar 29, 2021

@fangbinwei oh Im sorry, you're right :) ... thank you

@rgomezp
Copy link

rgomezp commented Jul 19, 2021

Any update?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests