Closed jmbarbier closed 10 months ago
Great discovery, I have to detect the error and update manually after ng update throws a lot of errors. Also, I notice that the console no longer throw any error when check and compile with pug after update to Angular 11 (in version 10 I got tons of those)
I tried those two updates @jmbarbier mentioned, but still got errors 👍
Error: Module parse failed: Unexpected character '#' (2:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|
> #ad-main
|
| #ad-header
I have upgraded my project from Angular 10 -> v.11. Any idea what I have forgotten ?
I tried those two updates @jmbarbier mentioned, but still got errors 👍
Error: Module parse failed: Unexpected character '#' (2:0) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | > #ad-main | | #ad-header
I have upgraded my project from Angular 10 -> v.11. Any idea what I have forgotten ?
You can try:
Method 1:
After update ng-add-pug-loader.js
as @jmbarbier mentioned above, run npm install
again. The postinstall
script in your package.json
will be executed and it will update the common.js
and typescript.js
.
Method 2:
node_modules/@angular-devkit/build-angular/src/webpack/configs/common.js
, add { test: /\.(pug|jade)$/, exclude: /\.(include|partial)\.(pug|jade)$/, use: [ { loader: "apply-loader" }, { loader: "pug-loader" } ] }, { test: /\.(include|partial)\.(pug|jade)$/, loader: "pug-loader" },
in the rules: [....]
sector (careful with the comma in the end because it's an array). node_modules/@angular-devkit/build-angular/src/webpack/configs/typescript.js
, find directTemplateLoading
and update value into false
.
Then you can run ng serve
again. Happy coding!Upgraded from 10 to 11. Although the common.js
and typescript.js
are correctly set, I still got the following error:
zone-evergreen.js:659
Unhandled Promise rejection: Errors during JIT compilation of template for AnalyticsOverlayBlockComponent:
Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.)
Any ideas?
Upgraded from 10 to 11. Although the
common.js
andtypescript.js
are correctly set, I still got the following error:zone-evergreen.js:659 Unhandled Promise rejection: Errors during JIT compilation of template for AnalyticsOverlayBlockComponent: Unexpected character "EOF" (Do you have an unescaped "{" in your template? Use "{{ '{' }}") to escape it.)
Any ideas?
I think you need to update your angular.json
which may help solve the problem. Example configuration:
"projects": {
"my-project": {
"architect": {
"build": {
"options": {
"aot": false
}
},
"configurations": {
"production": {
"aot": true
}
}
}
}
}
}
For more details, please take a look at #31
Thank you for your support.
The whole page is now blank: the <app>
element has no children.
I was using @angular-builders/custom-webpack
builder, but this also happens with the default @angular-devkit/build-angular
.
This only happens when the default builder is upgraded to 0.1100.0
.
For info since Angular v11.1.0, the option directTemplateLoading
that needs to be set to false, is now inside the file node_modules/@ngtools/webpack/src/ivy/plugin.js
It was changed by commit https://github.com/angular/angular-cli/commit/4e168b81c5de6c4ae91e29a40bdf0e0c98910fb4
@H--o-l but that seems to be an option for AngularWebpackPlugin
which apparently is not the same as AngularCompilerPlugin
. Unless they already exposed AngularWebpackPlugin
?
@Rush I can't answer sorry. All I know is that it fixes the issue for me for Angular 11.
This project is no longer maintained. Check out ngx-pug-builders to add support to pug files to your Angular project.
I've not enough time now for a PR, but for angular 11,
common.js
is nownode_modules/@angular-devkit/build-angular/src/webpack/configs/common.js
andtypescript.js
is now atnode_modules/@angular-devkit/build-angular/src/webpack/configs/typescript.js
so in
ng-add-pug-loader.js
, we have to update :