使用webpack模块

Using modules with webpack

本文关键字：模块 webpack 使用      更新时间：2023-09-26

我最近开始使用Webpack作为前端，并遇到了模块的问题。
例如，我有两个模块，一个使用另一个(具体来说，它的angular-bootstrap-slider和bootstrap-slider)。angular-bootstrap-slider初始化失败，原因是Slider函数未定义。
现在我明白，我可以全局导出Slider(我用jquery和angular库)或在angular-bootstrap-slider(我选择了)中导入Slider。
我不喜欢这两个选项，因为全局导出是我想避免使用webpack的事情之一，并且在库中导入某些东西意味着改变它的代码。
那么，我是否遗漏了一些东西，或者可能有一些处理依赖关系的最佳实践?

你要找的是shimming模块

这允许你声明Slider实际上是从模块bootstrap-slider中导入的:

...
plugins: [
  new webpack.ProvidePlugin({ 
    'Slider': 'bootstrap-slider'  
  })
]

我认为你可以使用imports-loader: https://github.com/webpack/imports-loader

为webpack导入加载器

可以用来将变量注入到模块的作用域中。这是当第三方模块依赖于global时尤其有用像$或this这样的变量是窗口对象。

相关文章：