2016-11-07 72 views
0

我正在试图加载angular2页面时,这个错误:(SystemJS)模块没有定义

https://postimg.org/image/meg0l2znn/

我的index.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>Reloyalty Administration Dashboard</title> 

    <!-- Viewport mobile tag for sensible mobile support --> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
    <link rel="icon" href="/favicon.ico"> 

    <!-- For Angular2 Routing --> 
    <base href="/"> 


    <!-- Common Scripts--> 
    <script src="/common/js/jquery-1.11.3.min.js"></script> 

    <!--SCRIPTS--> 
    <script src="/bootstrap/js/bootstrap.min.js"></script> 
    <script src="/dashboard/js/bootstrap-switch.js"></script> 
    <script src="/dashboard/js/calendar-conf-events.js"></script> 
    <script src="/dashboard/js/chartjs-conf.js"></script> 
    <script src="/dashboard/js/common-scripts.js"></script> 
    <script src="/dashboard/js/easy-pie-chart.js"></script> 
    <script src="/dashboard/js/form-component.js"></script> 
    <script src="/dashboard/js/gritter-conf.js"></script> 
    <script src="/dashboard/js/jquery-ui-1.9.2.custom.min.js"></script> 
    <script src="/dashboard/js/jquery.backstretch.min.js"></script> 
    <script src="/dashboard/js/jquery.dcjqaccordion.2.7.js"></script> 
    <script src="/dashboard/js/jquery.nicescroll.js"></script> 
    <script src="/dashboard/js/jquery.scrollTo.min.js"></script> 
    <script src="/dashboard/js/jquery.sparkline.js"></script> 
    <script src="/dashboard/js/jquery.tagsinput.js"></script> 
    <script src="/dashboard/js/jquery.ui.touch-punch.min.js"></script> 
    <script src="/dashboard/js/sparkline-chart.js"></script> 
    <script src="/dashboard/js/tasks.js"></script> 
    <script src="/dashboard/js/zabuto_calendar.js"></script> 
    <script src="/dashboard/js/bootstrap-inputmask/bootstrap-inputmask.min.js"></script> 
    <script src="/dashboard/js/chart-master/Chart.js"></script> 
    <script src="/dashboard/js/fancybox/jquery.fancybox.js"></script> 
    <script src="/dashboard/js/fullcalendar/fullcalendar.min.js"></script> 
    <script src="/dashboard/js/gritter/js/jquery.gritter.js"></script> 
    <script src="/dashboard/js/jquery-easy-pie-chart/jquery.easy-pie-chart.js"></script> 
    <script src="/js/node_modules/es6-shim/es6-shim.min.js"></script> 
    <script src="/js/node_modules/reflect-metadata/Reflect.js"></script> 
    <script src="/js/node_modules/systemjs/dist/system-polyfills.js"></script> 
    <script src="/js/node_modules/systemjs/dist/system.src.js"></script> 
    <script src="/js/node_modules/zone.js/dist/zone.js"></script> 
    <script src="/js/node_modules/rxjs/bundles/Rx.js"></script> 
    <!--SCRIPTS END--> 

    <script> 



     System.config({ 
      packages: { 
       app: { 
        format: 'register', 
        defaultExtension: 'js', 
        main: './main.js' 
       }, 
       '@angular/core': { 
        main: 'bundles/core.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/compiler': { 
        main: 'bundles/compiler.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/common': { 
        main: 'bundles/common.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/platform-browser-dynamic': { 
        main: 'bundles/platform-browser-dynamic.umd.js', 
        defaultExtension: 'js' 
       }, 
       '@angular/platform-browser': { 
        main: 'bundles/platform-browser.umd.js', 
        defaultExtension: 'js' 
       }, 
       rxjs: { 
        main: 'bundles/Rx.umd.min.js', 
        defaultExtension: 'js' 
       } 
      }, 
      map: { 
       'app': 'management', // where my app is. '.' means relative 
       '@angular': '/js/node_modules/@angular', 
       'rxjs': '/js/node_modules/rxjs' 
      } 
     }); 
     System.import('app') 
       .then(null, console.error.bind(console)); 
    </script> 

    <!-- end AngularJS 2--> 
</head> 

<body> 

<root-component>Loading...</root-component> 

</body> 
</html> 

这是怎么回事?为什么没有找到SystemJS ...

注: 我的文件夹结构是,应用程序是在资产/管理文件夹位于就像这样:

management/ 
├── app/ 
| ├──root/ 
│  ├── root.component.ts 
|  ├── root.module.ts 
├──main.ts 

NOTE2: 删除System.import ...结果在误差不被抛出

System.import('app') 
       .then(null, console.error.bind(console)); 

回答

0

我敢打赌,你需要先加载system.src.js,然后system-polyfills.js。你现在正在做另一种方式。

<script src="/js/node_modules/systemjs/dist/system.src.js"></script> 
<script src="/js/node_modules/systemjs/dist/system-polyfills.js"></script> 

参见:https://github.com/systemjs/systemjs#promise-polyfill

相关问题