DEV Community
·
使用Angular Material时无需使用importProvidersFrom
内容提要
Angular 14.0引入了importProvidersFrom函数，简化了独立应用的模块导入。现代Angular Material通过独立提供者优化配置，减小包体积，简化组件测试和Storybook配置，提高开发效率。
关键要点
-
Angular 14.0引入了importProvidersFrom函数，简化了独立应用的模块导入。
-
在Angular 14.0中，使用importProvidersFrom函数可以更明确地添加Angular模块导入。
-
经典Angular应用中，维护Angular模块导入的必要性不够清晰。
-
现代Angular Material版本允许省略某些导入，因为它们的依赖都是可树摇的。
-
使用提供者函数可以简化应用程序配置代码，减小包体积。
-
组件故事和组件测试的配置也变得更简单。
-
Angular Material组件的根级提供者配置更容易设置和理解。
-
Angular和Angular Material的发展历程包括从NgModule导入到使用importProvidersFrom函数。
延伸解读
Angular 14.0的变革
Angular 14.0引入的importProvidersFrom函数，标志着Angular在模块导入方面的重大变革。这一变化使得开发者在配置独立应用时，可以更清晰地理解每个模块的导入目的，提升了代码的可读性和维护性。
包体积优化的意义
通过使用现代Angular Material的独立提供者，应用的包体积得以显著减小。这不仅提高了加载速度，还优化了性能，尤其是在大型应用中，减少不必要的依赖可以显著提升用户体验。
组件测试的简化
新版本的Angular Material使组件测试的配置变得更加简单。开发者可以更轻松地设置测试环境，减少了配置的复杂性，从而专注于测试逻辑本身，这对于提高开发效率至关重要。
延伸问答
Angular 14.0引入的importProvidersFrom函数有什么作用？
importProvidersFrom函数简化了独立应用的模块导入，使得添加Angular模块导入更加明确。
使用Angular Material时，如何优化应用程序的配置？
可以使用提供者函数来简化应用程序配置代码，减小包体积，并提高组件测试和Storybook配置的效率。
现代Angular Material版本与经典版本的主要区别是什么？
现代版本允许省略某些导入，因为它们的依赖都是可树摇的，而经典版本则需要明确维护这些导入。
Angular Material组件的根级提供者配置有什么优势？
根级提供者配置更容易设置和理解，且可以优化包体积，减少不必要的依赖。
如何在Storybook中配置Angular Material组件？
可以使用applicationConfig Storybook装饰器来添加根级提供者，从而简化组件故事的配置。
Angular Material组件的独立提供者是什么时候引入的？
独立提供者在Angular Material 17.1版本中引入，简化了组件依赖的管理。
