问题描述
package.json:如下
{ 'name': 'tengai-medical', 'version': '1.0.0', 'description': '', 'main': 'index.js', 'scripts': { 'start': 'webpack && webpack-dev-server --hot --inline' }, 'author': 'Irene Tang', 'license': 'ISC', 'devDependencies': { 'angular': '^1.2.27', 'angular-bootstrap': '0.12.2', 'css-loader': '^0.24.0', 'file-loader': '^0.9.0', 'html-webpack-plugin': '^2.22.0', 'node-sass': '^3.8.0', 'requirejs': '2.1.15', 'sass-loader': '^4.0.0', 'style-loader': '^0.13.1', 'url-loader': '^0.5.7', 'webpack': '^1.13.2', 'webpack-dev-server': '^1.15.1' }}
index.js
var angular = require(’angular’);var bootstrap = require(’angular-bootstrap’);angular.element(document).ready(function() { var app = angular.module(’multi-bootstrap’, [’ui-bootstrap’]); app.controller(’myController’, [’$scope’, ’$modal’, function($scope, $modal) { }]); angular.bootstrap(document, [’multi-bootstrap’]);})现在我定义的myController需要用到$modal服务,这个服务在angular-bootstrap里,为什么require(’angular’)能拿到angular,require(’angular-bootstrap’)拿到的却是个空对象???新建模块的时候该怎么引入依赖模块???
问题解答
回答1：var angular = require(’angular’);require(’angular-bootstrap/ui-bootstrap’);angular.element(document).ready(function() { var app = angular.module(’multi-bootstrap’, [’ui.bootstrap’]); app.controller(’myController’, [’$scope’, ’$modal’, function($scope, $modal) { }]); angular.bootstrap(document, [’multi-bootstrap’]);})
angular-bootstrap是node_modules下的一个文件夹,里面有一个ui-bootstrap的js文件,一定要先引入angular,才能再引入require(’angular-bootstrap/ui-bootstrap’),因为它依赖angular,最后使用的时候是ui.bootstrap而不是ui-bootstrap,因为ui-bootstrap里面定义的模块名是ui.bootstrap
回答2：我觉得你的可能包引错了吧，换angular-ui-bootstrap。你可以看源码，angular中有export这个关键字，angular-bootstrap中就没有export
