将非 commonJS 库包含到 Webpack 上下文的好方法是什么？

Question

我想包含一个定义 AngularJS 模块的外部和非 commonJS 库。

什么是正确的方法，因为我显然不能写：

import MyLibrary from 'MyLibraryPath'
angular.module('MyApp', MyLibrary)

编辑--------

我刚完成：

require('path/myLibrary.js'); angular.module('MyApp', 'moduleName');

而且有效。

这是一个好习惯吗？

Answer 1

是的，如果库不导出 Angular 模块的 name property 也没关系。 Angular 在设计时并未考虑 JS 模块，最初提倡 angular.module('MyApp', ['moduleName']) 模块定义风格。

从模块中导出 name 是比较流行的惯例，尤其是因为可以做到

import * as MyLibrary from 'MyLibraryPath';

并将其用作

angular.module('MyApp', [MyLibrary]);

如果没有模块导出，可以用Webpack处理exports-loader和

module: {
    loaders: [
        {
            loader: 'exports-loader',
            test: /path\/myLibrary\.js$/,
            query: '"moduleName"'
        }
    ],
},

配置，本质上是将module.exports = "moduleName";添加到模块中。

如果您打算 PR/create 不导出 name 的库的问题，请使用此技巧暂时解决此问题。我不建议为了保持代码的一致性而使构建更复杂。

将非 commonJS 库包含到 Webpack 上下文的好方法是什么？

What is a good way to include a non-commonJS library to Webpack context?

javascript

commonjs

angularjs

webpack