loader-webpack icon indicating copy to clipboard operation
loader-webpack copied to clipboard

Using aliases/paths not supported in require tag

Open michaelw85 opened this issue 6 years ago • 0 comments

I'm submitting a bug report

  • Library Version: aurelia-loader-webpack 2.2.1

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.

<require from="@root/hello-world/hello-world"></require>
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 {}

michaelw85 avatar Feb 26 '19 09:02 michaelw85