Error: Unable to find module with ID: @root/hello-world/hello-world.html
at WebpackLoader.eval (aurelia-loader-webpack.js?e63c:197)
at step (aurelia-loader-webpack.js?e63c:41)
at Object.eval [as next] (aurelia-loader-webpack.js?e63c:22)
at eval (aurelia-loader-webpack.js?e63c:16)
at new Promise (<anonymous>)
at __awaiter (aurelia-loader-webpack.js?e63c:12)
at WebpackLoader._import (aurelia-loader-webpack.js?e63c:162)
at WebpackLoader.eval (aurelia-loader-webpack.js?e63c:262)
at step (aurelia-loader-webpack.js?e63c:41)
at Object.eval [as next] (aurelia-loader-webpack.js?e63c:22)
Expected/desired behavior:
When aliases are configured in webpack I expect the loader to include these trying to resolve the module.
What is the motivation / use case for changing the behavior?
Enable usage of aliases making paths in the require statement easier to maintain.
Workaround
Load in TS and pass the class using viewResources decorator.
import { HelloWorldCustomElement } from '@root/hello-world/hello-world';
import { viewResources } from 'aurelia-templating';
@viewResources(HelloWorldCustomElement)
export class App {}
I'm submitting a bug report
Please tell us about your environment:
Operating System: Windows [10]
Node Version: 10.15.1
NPM Version: 6.4.1
JSPM OR Webpack AND Version webpack 4.29.0
Browser: Chrome Version 72.0.3626.119 (Official Build) (64-bit)
Language: TypeScript 3.3.1
Current behavior: Require custom component does not work from template when using an alias/ts path.
Expected/desired behavior: When aliases are configured in webpack I expect the loader to include these trying to resolve the module.
Workaround Load in TS and pass the class using viewResources decorator.