2016-04-25 142 views
2

我试图在Firebase上部署angular2应用程序。我遵循this指南,但是当我输入firebase open时,出现错误(请参阅下文)。在Firebase上部署Angular2应用程序

这是

\root 
    \ app 
    \ assets 
    \ dev 
    \ node_modules 
    \ public 
    \ src 
    \ typings 
    index.html 
    firebase.json 
    gulpfile.js 
    package.json 
    tsconfig.json 
    typings.json 

我已经把所有的文件我app文件夹中的我的应用程序的结构(他们.js文件,从.ts那些它们dev文件夹中transpiled)公共文件夹内。我也复制了公共文件夹中的index.html文件。

所以现在公共文件夹结构是:

\public 
    \app 
     |-> app.component.js 
     |-> boot.js 
     |-> other .js files 
    index.html 

这是index.html的:

<html> 
<head> 
    <base href="/"> 
    <title>Angular 2 Boilerplate</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- Load libraries --> 
    <!-- IE required polyfills, in this exact order --> 
    <script src="node_modules/es6-shim/es6-shim.min.js"></script> 
    <script src="node_modules/systemjs/dist/system-polyfills.js"></script> 
    <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script> 
    <script src="node_modules/systemjs/dist/system.src.js"></script> 
    <script src="node_modules/rxjs/bundles/Rx.js"></script> 
    <script src="node_modules/angular2/bundles/angular2.dev.js"></script> 
    <script src="node_modules/angular2/bundles/router.dev.js"></script> 
    <script src="node_modules/angular2/bundles/http.js"></script> 


    <link rel="stylesheet" href="src/css/app.css"> 
</head> 
<body> 
<my-app>Loading...</my-app> 

<script> 
    System.config({ 
     packages: { 
      app: { 
       format: 'register', 
       defaultExtension: 'js' 
      } 
     } 
    }); 
    System.import('app/boot') 
      .then(null, console.error.bind(console)); 
</script> 
</body> 
</html> 

我firebase.json是这样的:

{ 
    "firebase": "wetta", 
    "public": "public", 
    "ignore": [ 
    "firebase.json", 
    "**/.*", 
    "**/node_modules/**" 
    ] 
} 

错误,谷歌镀铬控制台shows is: (index):24 Uncaught ReferenceError: System is not defined

我正朝着正确的方向走吗?什么导致了这个错误?

回答

3

问题的根本原因是,从index.html的脚本要调用

System.config(...

但在

<script src="node_modules/systemjs/dist/system.src.js"></script> 
定义的系统对象

未加载,因为在您的firebase.json中,您忽略了/node_modules/的规则,并且system.src.js未上传到Firebase服务器上。

从node_modules上传所有内容是不实际的,因为有许多文件的存在。

我能解决下面的步骤问题:与

  • 创建角2应用角CLI
  • 构建我的应用程序与纳克建立这创造DIST文件夹我的应用程序
  • 初始化firebase init。对于“什么样的目录应该是公共根?”给答案dist
  • firebase deploy