Repository navigation
@ngtools/webpack breaks when project has # character on path #9100
Description
Versions
$ node --version
v8.7.0
$ npm --version
5.4.2
$ yarn --version
1.3.2
Running Windows 10 Pro x64
Shell: Git bash
Repro steps
- Clone https://github.com/dealloc/ngtools-webpack-reproduction
- Install dependencies using
yarn install - Start application using
yarn start
Observed behavior
You will get a blank page with "Loading..." and in the console the following error:
Uncaught Error: No NgModule metadata found for 'AppModule'.
at NgModuleResolver.webpackJsonp../node_modules/@angular/compiler/esm5/compiler.js.NgModuleResolver.resolve (compiler.js:20233)
at CompileMetadataResolver.webpackJsonp../node_modules/@angular/compiler/esm5/compiler.js.CompileMetadataResolver.getNgModuleMetadata (compiler.js:15186)
at JitCompiler.webpackJsonp../node_modules/@angular/compiler/esm5/compiler.js.JitCompiler._loadModules (compiler.js:34255)
at JitCompiler.webpackJsonp../node_modules/@angular/compiler/esm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:34216)
at JitCompiler.webpackJsonp../node_modules/@angular/compiler/esm5/compiler.js.JitCompiler.compileModuleAsync (compiler.js:34110)
at CompilerImpl.webpackJsonp../node_modules/@angular/platform-browser-dynamic/esm5/platform-browser-dynamic.js.CompilerImpl.compileModuleAsync (platform-browser-dynamic.js:230)
at PlatformRef.webpackJsonp../node_modules/@angular/core/esm5/core.js.PlatformRef.bootstrapModule (core.js:5568)
at Object../src/main.ts (main.ts:11)
at __webpack_require__ (bootstrap 1550deb7735f43aaf874:712)
at fn (bootstrap 1550deb7735f43aaf874:117)
at Object.2 (main.ts:11)
at __webpack_require__ (bootstrap 1550deb7735f43aaf874:712)
at webpackJsonpCallback (bootstrap 1550deb7735f43aaf874:25)
at app.js:1
Desired behavior
The application should run properly and display the text "Hello world!" in a <h1> tag.
Mention any other details that might be useful (optional)
I have discovered that when running the application from my desktop (or any folder with a short pathname) the application runs properly (showing Hello world!) but when placed in a folder with a longer pathname the application compiles but the produced code is broken and will not run (resulting in the stacktrace given above).
Interestingly, the build sizes are wildly different too differing about ~400kb (invalid code being larger)
Activity
clydin commentedon Jan 5, 2018
Can you provide an example of what would be considered a long path? (Character count, directory depth, etc.)
dealloc commentedon Jan 5, 2018
Apologies, I thought I had included that in the issue (must've slipped out in editing it).
A short path with which I got it working would be:
C:\Users\wannes\Desktop\Frontend(28 characters)A long path with which the build produces broken code would be:
E:\C#46\trunk\DataRouting\Customer\AAA\TruckRegistration\Frontend(58 characters)I first considered the error might occur because it's on a different drive (E vs C) but placing the project in
E:\Frontendyields working code as well.filipesilva commentedon Jan 9, 2018
Can you try removing the
#from the path? I think there were cases where that broke.dealloc commentedon Jan 9, 2018
Removing the
#seems to fix the problem indeed.Any pointers as to where exactly the problem lies? I wouldn't mind creating a PR if it's possible to fix this
filipesilva commentedon Jan 9, 2018
I think it's in the entry module logic:
angular-cli/packages/@ngtools/webpack/src/angular_compiler_plugin.ts
Lines 133 to 141 in 9b85c07
It's meant to split something like
/path/to/file.ts#ClassName, but can fail to do it properly. It probably needs to be adjusted to try and get the class name only as the last bit. A PR would be most welcome. I'll adjust the issue title accordingly.[-]@ngtools/webpack produces broken code on long paths[/-][+]@ngtools/webpack breaks when project has # character on path[/+]dealloc commentedon Jan 9, 2018
I created a pull request (the second one, I kind of botched the first one) that should hopefully fix this.
angular-automatic-lock-bot commentedon Sep 7, 2019
This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.