Question

我正在尝试引导使用Webpack构建的AngularJS应用程序。但是我收到以下错误，模块没有设置。

TypeError: _angular.angular is undefined

我深入研究生成的代码块，发现_angular.angular来自

var _angular = __webpack_require__(1);

var _angularUiBootstrap = __webpack_require__(3);

_angular.angular.module('app', [_angularUiBootstrap.bootstrap]).constant('_', window._).run(function ($rootScope) {
  $rootScope._ = window._;

看起来_angular.angular.module应为_angular.module。我可能使用错误的方法来引导角度，或使用不正确的Webpack配置。这是我的代码：

webpack.config.js

var webpack = require('webpack');
var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

var srcDir = 'static_src';
var outputDir = 'static';

module.exports = {
  devtool: 'source-map',
  debug: true,
  entry: {
    app: path.resolve(srcDir, 'app.js')
  },
  output: {
    path: outputDir,
    filename: '[name].bundle.js',
    sourceMapFilename: '[name].map',
    chunkFilename: '[id].chunk.js'
  },
  resolve: {
    extensions: ['', '.js', '.less', '.css'],
    alias: {
      npm: __dirname + '/node_modules'
    }
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        loader: 'babel',
        query: {
          presets: ['es2015'],
          plugins: ['syntax-decorators', 'ng-annotate']
        },
        exclude: /node_module/
      },
      { test: /\.less$/, loader: 'to-string!css!less' },
      { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
      { test: /\.(png|gif|jpg)$/, loader: 'file?name=images/[name].[ext]' }
    ]
  },
  plugins: [
    new webpack.NoErrorsPlugin(),
    new webpack.optimize.DedupePlugin(),
    new ExtractTextPlugin('[name].css')
  ]
};

app.js

import { angular } from 'angular';
import { bootstrap } from 'angular-ui-bootstrap';

angular.module('app', [bootstrap]);

我使用的是角1.5.0和webpack 1.12.14。

提前致谢。

Answer 1

您的错误在require语句中。你正在使用

import { angular } from 'angular';

这意味着导出的角度模块内部存在角度变量。你想要使用的是

import angular from 'angular';

试试。

加载由webpack构建的角度应用程序时出现_angular.angular undefined错误

1 个答案: