Closed XenoBino closed 2 years ago
Hello @XenoBino,
thank you for the bug report! I will try reproduce it by me local.
Hello @XenoBino
views/index.pug
by alias @component/
, is missed the s
at end. Please edit your message.
include @component/nav
==> include @components/nav
resolve.alias
resolve.alias
:
resolve: {
//plugins: [tsConfig], // this is not supported
alias: {
'@components': helpers.src('components'), // this works
},
},
Hello @XenoBino ,
Good news, I've taken the time to improve the alias resolving.
I already have positive results. Soon I release next version with support of resolve.plugins
.
Hi @webdiscus,
Thank you for taking time to review and fix the issue.
I am about to meet a deadline in a project I am working on, and the paths
/resolve.alias
issues was really frustrating and time consuming to deal with, so I really appreciate all the effort spent in solving this issue.
In reply to 3 in your second comment, I tried using resolve.alias
as a substitute to paths
in my project, but it seems that the typescript loader, @ngtools/webpack
, doesn't honor aliases defined their. In my free time I tested @ngtools/webpack
with resolve.alias
in an empty project, and strangely it worked. I might also open an issue in @ngtools/webpack
about this.
Generally, I suggest not to use resolve.alias
with typescript, since IDEs and editors will not understand imports.
Hello @XenoBino,
I have added support for resolve.plugins
. Currently it works only for extends
and include
, not for require()
, because for it used the complex Interpolation
. To resolve embedded resources via require()
use alias.
The very fast resolve.alias
will be used first, if nothing is resolved then the slow webpack resolver will be used.
Warning: using a resolver other than resolve.alias can seriously degrade performance.
Please try the new NPM package ^1.6.2
.
Here is the test case for resolve.plugins .
Hello @XenoBino,
can you please test new fixed version 1.6.2
and if all is ok than close this issue?
Hello @webdiscus,
My apologies for the late reply, I have been busy the past month.
After 1.6.0-alpha1
, the loader began to have issues with hot module replacement which might mean that files are not being added to the dependency tree thus not watched. I have updated to 1.7.1
and the issue continued. I might rollback to 1.5.*
till this feature is stable.
Additionally I suggest adding an option to enable (making it disabled by default) the behavior added after this issue as it slows the build process. Also I believe that it is uncommon for a developer to have the same case described above.
Hello @XenoBino,
possible that the problem with watching of dependencies has a relation with the issue path errors on Windows. This issue was fixed in new version 1.7.3
.
Note: by webpack serv
the live reload of browser after rebuild is not supported.
The new resolver in pug-loader firstly try to resolve an alias from resolve.alias
(this is fastest method), then if alias not resolved try to resolve with slow enhanced-resolver
to resolve from resolve.plugins
.
To speed up the build process should be used resolve.alias
only. Each item in alias should be a string. If alias is array of paths, will be used slow enhanced-resolver.
Hello, @webdiscus.
I ran a few tests and everything seems to be working correctly after I upgraded to 1.7.3
.
Build time became 81s (2.5s or less incremental) on my mid tier device.
Thanks for taking time to solve these issues.
Hello @XenoBino,
thanks for the feedback :-)
Description
Sorry for my bad English as my mother tongue is not English. I use tsconfig-paths-webpack-plugin to add
resolve.alias
in webpack. Other loaders likesass-loader
are totally fine with the alias, but pug compilation fails which leads me to believe that the problem is in this loader.Info
Temporary solution (until fixed)
While writing this issue I tried different temporary solutions which all had a problem in a way or other thus I suggest that you manually add the needed paths to
resolve.alias
in your webpack config.Build log
Steps to reproduce
Clone the following directory structure and file contents:
Directory structure
File contents
package.json
tsconfig.json
webpack.config.js
views/index.pug
views/index.scss
components/nav.pug
components/nav.scss