就我使用 angular 而言,加载自定义模块和外部库的最佳实践是将 angularjs 与 requirejs 结合起来。
它分 3 步完成。
首先,在您的主 html 文件中加载一个构建系统基础的 js 文件(require.config):这里有所有允许的参数:https ://github.com/jrburke/r.js/blob/master/构建/example.build.js
示例:在您的 html 文件中:
<script src="path/to/require.js" data-main="path/to/yourBuildFile"></script>
在您的BuildFile 文件中:
require.config({
// you can define suitable names for all your external js library
paths:{
// don't put a ".js" at the end of the file
'angular' : 'path/angular',
'underscore' : 'path/underscore-min',
'...': '...',
},
// and other useful things
});
其次,在同一个文件或另一个文件中(请参阅上面链接中的参数 deps),引导您的应用程序:就像这里解释的那样:https ://docs.angularjs.org/guide/bootstrap
例子:
// AMD module injection, more info here : http://requirejs.org/docs/whyamd.html
define([ // inject all the external library you need + the definition of your app
'angular',
'require',
'yourpath/yourApp' // don't bother here, it's explained in third point
], function(angular){
// link your app to the document file programatically
angular.bootstrap(document, ['nameOfYourApp']);
});
第三,您定义您的应用程序(在“yourpath/yourApp”中)
例子:
define([
'angular',
// put all path to your directives + controllers + services
], function(angular){ // only specify parameters the library you use in the function
// you create your sublime app :)
angular.module('nameOfYourApp', [
// put all the name of your modules injected above
]);
});
上面的示例是为单页应用程序制作的。您可以在此处找到多页应用程序的其他示例
http://requirejs.org/docs/start.html