在Angular项目中仅导入DefaultUrlSerializer类而不是整个路由器模块

Question

以下导入语句将整个路由器模块导入最终的webpack包中。

import { DefaultUrlSerializer } from '@angular/router';

有没有仅导入DefaultUrlSerializer而不涉及其他无关模块的方法？我正在使用Webpack模块构建器和Angular Cli进行AOT/生产构建。

- David Chelliah

---

我不确定你想做什么。DefaultUrlSerializer是路由器模块的一部分，必须与路由器一起使用（预计它用于路由文件描述中的参数）。单独导入它是没有意义的，不是吗？ - ssbb

我只想将DefaultUrlSerializer作为库来使用，以解析给定的URL并读取URL段或查询字符串......在Angular 1.x中，它很简单$location.search().paramname - David Chelliah

到目前为止，DefaultUrlSerializer在Angular的路由器模块中被导出。因此，在没有获取完整的路由器模块的情况下，您无法（据我所知）获得它。否则，导入/导出系统将会完全混乱。我会等待更有经验的人来验证。如果您很着急，仍然可以从Angular中复制该类并将其添加到自己的项目中。说起来可能不太好听！ - ssbb

我已经在原始问题中添加了所需的信息。 - David Chelliah

Answer 1

不，除非您自己构建Angular，否则无法这样做。 npm包不会将模块分开提供，而是作为UMD格式的一个捆绑包：

  node_modules
    @angular
       router
         bundles
           router.umd.js

无论您如何导入DefaultUrlSerializer，webpack都会在最终构建中包含整个router.umd.js的内容，因为它无法从文件中提取代码。

- Max Koretskyi

---

根据您的回复，我浏览了node_modules文件夹，并看到了一个单独的巨大路由文件...看到所有的导出和导入语法，我想象它是用ES6编写的，而实际上这些只是糖衣包装的声明 :(。感谢您指向正确的目录。 - David Chelliah

@DavidChelliah，好的。 “这些只是糖衣声明” - 是的，它只包含声明文件。 - Max Koretskyi

我不想拉取整个路由器模块，所以我删除了所有对@angular/routing的引用，并用一种替代的URL解析NPM包url-parse进行了替换。这里链接了一个展示替代实现的帖子https://davidsekar.com/angular/parse-url-in-angular2- - David Chelliah