Repository navigation
karma errors when using non-relative path import #3586
Description
OS?
Mac OSX (El Capitan)
Versions.
angular-cli: 1.0.0-beta.22-1
node: 6.9.1
os: darwin x64
Repro steps.
app created using the CLI. Code changes on tsconfig.json, add following lines:
"baseUrl": ".",
"paths": {
"services/*": ["app/shared/services/*"]
},
The log given by the failure.
While this configuration is working very well on 'ng serve', the app runs as expected. But failed on 'ng test', it seems like Karma doesn't recognize the non-relative path'. Following is Error msg:
ERROR in ./src/app/cart/cart-summary/cart-summary.component.ts Module not found: Error: Can't resolve 'services/cart' in '/Users/stevezheng/webstorm/mai/src/app/cart/cart-summary'
@ ./src/app/cart/cart-summary/cart-summary.component.ts 12:13-37
@ ./src/app/cart/cart-summary/cart-summary.component.spec.ts
@ ./src .spec.ts
@ ./src/test.ts
Chrome 54.0.2840 (Mac OS X 10.11.6) ERROR
Uncaught Error: Cannot find module "services/cart"
at webpack:///Users/stevezheng/webstorm/mai/src/app/cart/cart-summary/cart-summary.component.ts:3:0 <- src/test.ts:53357
Other details:
There's no error when I import "services/cart" in my feature.module.ts, but do throw errors when import in xxx.component.ts.
Again, there's no error for running app but runing test.
Do I need to config more to make test work or this is a bug?
I created a sample for you testing:
https://github.com/SteveZheng-BSFT/karma-error-sample
After changing to relative path, ng test has no errors.
Activity
zzs1020 commentedon Dec 16, 2016
@rolandoldengarm this way does fix the issue, but it's somehow inconvenient because I can't put a wildcard here. Hopefully this is not the best choice...
vfedoriv commentedon Dec 18, 2016
I too have something like that, #3533
Wait beta.23, maybe...
drakenfly commentedon Dec 21, 2016
Still having the same issues with beta.24. Does somebody has any tips for getting this to work, besides writing every import to browser: { ... } inside package.json?
As @SteveZheng-BSFT already said: It is working with ng serve. Only ng test fails when resolving the modules.
AnianZ commentedon Dec 22, 2016
Me too.
ng serveandng buildwork just fine but i can't test my apps.jakpaw commentedon Dec 22, 2016
Same for me.
drakenfly commentedon Dec 29, 2016
Hi!
I created a temporary workaround to fix this problem.
New files
Save the code of my gist to a file named
common.js. I've put it into/tools/ng-test.Create three more files inside the same folder:
prepare.jsupdate.jsrevert.jspackage.json scripts
Update your package.json like this:
{ "scripts": { "test-single-run": "npm run prepare-test && npm run test -- --single-run --progress=False && npm run revert-test", "prepare-test": "node tools/ng-test/prepare.js", "revert-test": "node tools/ng-test/revert.js", "update-test": "node tools/ng-test/update.js", ... }, ... }node\npm run prepare-test, to write all ts-files insrc-folder to package.json. Tests can now be executed successfully again.node\npm run update-test, to update all paths in package.json's browser-property, when new files were added etc.node\npm run revert-test, to revert package.json to it's original state, as soon as testing is finished.To simplify this process, run
node\npm run test-single-run. This will prepare, run tests (but only once - watching is disabled!) and revert in correct order.I hope, someone is successful with that too. Have fun!
fix(test): fix tsconfig paths resolver
fix(@ngtools/webpack): fix tsconfig paths resolver (#3831)
fix(@ngtools/webpack): fix tsconfig paths resolver (angular#3831)
angular-automatic-lock-bot commentedon Sep 6, 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.
fix(@ngtools/webpack): fix tsconfig paths resolver (angular#3831)