Webpack 正在加载模块两次答案

【问题标题】：Webpack is loading module twiceWebpack 正在加载模块两次
【发布时间】：2015-10-09 18:04:33
【问题描述】：

我正在使用 webpack 来构建我的 angular.js 应用程序。举个简单的例子：

app.js

var angular = require('exports?window.angular!angular'),
    angularMoment = require('angular-moment');

angular.module('myApp', [angularMoment]);

angular-moment.js

define(['angular', 'moment'], function(angular, moment) {
  // some library code
});

这里有两种 angular 的导入方式，使用 loader 和仅使用名称。这会导致 angular 将被注入到页面两次，我在控制台中看到以下警告：

WARNING: Tried to load angular more than once.

有没有办法让 webpack 将 angular 的两个导入视为同一个模块？

我的webpack.conf.js

module.exports = {
  entry: {
    'app': './src/app/app.js'
  },
  plugins: [
    new webpack.ResolverPlugin(
      new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin("bower.json", ["main"])
    ),
    new AngularPlugin()
  ]
};

【问题讨论】：

您想在您的应用程序中包含 Angular 捆绑包吗？我发现对于这些与 webpack 不兼容的库，首先加载离散文件更容易。
这似乎是一个合理的解决方案。试图做到这一点，它的工作原理。您想将解决方案扩展到 awnswer 还是我可以自己做？

标签： angularjs webpack commonjs

【解决方案1】：

一种选择是让 angular 成为一个独立的脚本，并将其配置为外部依赖项：

module.exports = {
  external: {
      'angular' : 'angular'
  },
  entry: {
    'app': './src/app/app.js'
  },
  plugins: [
    new webpack.ResolverPlugin(
      new webpack.ResolverPlugin.DirectoryDescriptionFilePlugin("bower.json", ["main"])
    ),
    new AngularPlugin()
  ]
};

【讨论】：