Question

我正在构建一个使用webpack捆绑所有javascript，节点模块和bower组件的应用程序。我能够让角度和节点模块独立工作，但当我试图包含我的凉亭组件时，我得到以下错误

app.bundle.js:9 Uncaught TypeError: angular.module is not a function

我的webpack构建是什么样的

var webpack = require('webpack');
var BowerWebpackPlugin = require("bower-webpack-plugin");
module.exports = {
  loaders: [
    {test: /\.css$/, loader: "style!css"},
    {test: /\.(woff|svg|ttf|eot)([\?]?.*)$/, loader: "file-loader?name=[name].[ext]"}
  ],
  context: __dirname + '/web',
  entry: {
    app: './app.js',
    vendor: ['angular']
  },
  resolve: {
        modulesDirectories: ["web_modules", "node_modules", "bower_components"]
    },
  output: {
    path: __dirname + '/dist/js',
    filename: 'app.bundle.js'
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin( /* chunkName= */ "vendor", /* filename= */ "vendor.bundle.js"),
    new BowerWebpackPlugin({
      excludes: /.*\.less/
    }),
    new webpack.ProvidePlugin({
      $:      "jquery",
      jQuery: "jquery"
    })
  ],
  extensions: ['', '.json', '.js']
};

在我的app.js（角度应用声明文件）里面我有这个

var angular = require('angular');
require("jquery");
require("bootstrap");

angular.module('App', []);

require('./services');
require('./controllers');
require('./directives');

如何解决此问题？

编辑**我开始认为它与使用commonschunkplugin和bowerwebpackplugin

的相同入口点有关

Answer 1

在我使用Browserify的基于npm的项目中，我遇到了类似的问题。然后我注意到在另一个讨论或者说的文件（释义）中：

不会在var中存储角度，因为它会产生对角度
的全局引用的问题

所以而不是

var angular = require('angular');

试

require('angular');

仍然像往常一样调用angular.module( name, [])。我的猜测是require('angular')的任何回报都是undefined，或者没有提供角度API。

带角1和凉亭的webpack

1 个答案: