带有@ngtools/webpack 的 Angular 延迟加载在 webpack 中不起作用 [英] Angular lazy loading not working in webpack with @ngtools/webpack

问题描述

懒惰模块正在急切加载，没有为懒惰模块创建单独的块

我创建了一个 repo 来重现问题

I created a repo to reproduce the issue

1.Clone https://github.com/sameerthekhans/懒加载角度-webpack-temp.git

2.npm i

3.npm start

4.Output - dist 中没有创建块文件，并且模块在浏览器中急切加载

4.Output - No chunk files created in dist and the module is eagerly loaded in the browser

附加信息
我使用了所有最新版本的依赖项 Angular - 11.1.1、Webpack - 5 等等...
*另外请注意，我没有使用 angular-router-loader 作为 @ngtools/webpack.

Additional Info
I used all the latest version of dependencies Angular - 11.1.1, Webpack - 5 and So on...
*Also note I didn't used angular-router-loader as @ngtools/webpack is used.

推荐答案

主要问题是在你的 tsconfig 中你定义了 module: "commonjs".commonjs 不尊重动态导入语法.例如，您需要将其更改为 module: "ESNext".

The main issue is that in your tsconfig you define module: "commonjs". commonjs doesn't respect dynamic import syntax. You need to change it to module: "ESNext" for example that does.

这篇关于带有@ngtools/webpack 的 Angular 延迟加载在 webpack 中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！