angglarがrequireを通じて第三者プラグインを呼び出す問題について

5828 ワード

参考文献リスト

http://www.open-open.com/lib/view/open1413189699875.html

https://www.sitepoint.com/using-requirejs-angularjs-applications/

https://zhidao.baidu.com/question/371926516474026684.html

http://beginor.github.io/2014/11/17/load-angularjs-with-requirejs.html （このファイルに誤解されました）

問題の背景
requirejsによってanglarを使用して開発するには、ui-notificationなどの第三者のパチンコプラグインを参照する必要があります。文章を読むhttp://www.jianshu.com/p/cfc7e39cbbb5はい、それはwebpackを通して使います。サードパーティのプラグインを引用しないなら、アングラーの書き方だけでも大丈夫です。htmlコード

js書き方

require.config({
    paths:{
        'angular':"./common/angular",
        'ui-notification':"./common/angular-ui-notification.min",
        'config':"./config",
        'getUrl':"./getUrl",
        'util':"./util",
        'setLang':"./setLang",
        'angular-route':"./common/angular-route",
        'appstart':"./appstart"
    },
    shim: {
        'angular': {
            exports: 'angular'
        },
        'ui-notification':{
            deps:['angular'],
            exports:'ui-notification'
        },
        'angular-route': { deps: ['angular'] }

    },
})

require(['angular'],function (angular) {
    angular.module("app", []);
    angular.module("app").controller('loginController', ['$scope',, function($scope) {
        $scope.greeting = 'Hello, world!';
        console.log(1)
    }]);

})

今はui-notificationを導入して、ずっと間違えました。書き方は次の通りです

require(['angular','ui-notification'],function (angular) {
    angular.module("app", ['ui-notification']);
    angular.module("app").controller('loginController', ['$scope','Notification', function($scope,Notification) {
        Notification("hello")
        $scope.greeting = 'Hello, world!';
        console.log(1)
    }]);

})

ずっと次のエラーを報告しています。

angular.js:78 Uncaught Error: [$injector:modulerr] Failed to instantiate module app due to:
Error: [$injector:nomod] Module 'app' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

ずっとぼんやりしています。その後この文章を見つけました。https://www.sitepoint.com/using-requirejs-angularjs-applications/
The Anglar aplication cannot boot boot ststststststststststststaped usinininininininininap directive as as the rerequrererererererererererererererererererererererererestststststststststststststststststaping.This has has thethethethethethethethethethethethethethethethethethethethethethethethethethetheisisisisisisisisaastststininininininininininininininininininininininininininininininininininininininininininininininininthis file is shown below.
angglarに依存しているjsファイルを非同期的にロードした場合、angglarプログラムを起動することはできません。正しい方法は、手動起動use manual bootstrappingである。これは特別なファイルに書かなければなりません。これは先にangglar moduleを定義したファイルをロードする必要があります。コードの書き方は以下の通りです。

require(['app/ideasModule'],
  function() {
    angular.bootstrap(document, ['ideasApp']);
  }
);

ここのidasModuleファイルはモジュールです。
私たち自身の文書の書き方に戻ります。

http://beginor.github.io/2014/11/17/load-angularjs-with-requirejs.html （このファイルに誤解されました）

RequireJSはスクリプトスクリプトスクリプトスクリプト/main.jsを自動的にロードし、main.jsファイルの中に配置し、AnglarJSを動的にロードします。ファイルの内容と説明は以下の通りです。

requirejs.config({
    //         ，     html
    baseUrl: 'scripts',
    paths: {
        // angular      ，     baseUrl
        'angular': 'lib/angular/angular',
        'angular-route': 'lib/angular/angular-route'
    },
    shim: {
        //           angular      ，       
        'angular' : { exports: 'angular' },
        //    angular         angular     
        'angular-route': { deps: ['angular'] }
    }
});

完全な配置はこちらをご覧ください。https://gist.github.com/beginor/e57e596be4040c404044）上記の設定があったら、ファイルの末尾に次のテストを追加します。


 ： angular-route 。 。
 。
 main.js ， 
require.config({
    paths:{
        'angular':"./common/angular",
        'ui-notification':"./common/angular-ui-notification.min",
     },
    shim: {
        'angular': {
            exports: 'angular'
        },
        'ui-notification':{
            deps:['angular'],
            exports:'ui-notification'
        },
    },
})
//     
//       app，        app1.js  。
//     controller  ，          
require(['app1'],function () {
    angular.bootstrap(document, ['app']);
})


 app1.js 
 :

define("app1",XXXX) app1 ( .js), 

angular is not defined

define('app1', ['angular','ui-notification'], function(angular) {
    //       
    'use strict';
    //    angular   
    var app = angular.module('app', ['ui-notification']);
    //    DemoController ，         greeting      。
    app.controller('loginController', ['$scope','Notification', function($scope,Notification) {
        Notification("1hello")
        $scope.greeting = 'Hello, world!';
    }]);
    return app;
});

 ：bootstrap appは、ap 1のmoduleのアプリと していなければならない。

[centos]JDK 1.8をインストールする

DockerはElasticSearch-Headプラグインを構築します。