Question

所以我有一个Angular 2应用程序在本地运行没有问题。使用heroku部署我的应用程序时，会出现以下错误：

>SyntaxError: expected expression, got '<'
><!DOCTYPE html>
>shim.min.js (Zeile 1)
>
>SyntaxError: expected expression, got '<'
><!DOCTYPE html>
>zone.js (Zeile 1)
>
>SyntaxError: expected expression, got '<'
><!DOCTYPE html>
>Reflect.js (Zeile 1)
>
>SyntaxError: expected expression, got '<'
><!DOCTYPE html>
>system.src.js (Zeile 1)
>
>ReferenceError: System is not defined
>systemj...nfig.js (Zeile 6, Spalte 3)
>
>ReferenceError: System is not defined
>mean1nv...app.com (Zeile 24, Spalte 7)

有类似的帖子提示所有类型的更改，但我不知道它在我的代码中断了。我觉得有点失明，我之前没有遇到任何问题就部署了类似的应用程序，我无法找到差异。

server.js

 var express = require('express');
 var path = require('path');
 var bodyParser = require('body-parser');

 var items = require('./routes/items');

 var app = express();
 app.set('port', (process.env.PORT || 3000));

 app.use(express.static(path.join(__dirname,'client')));

 app.use(bodyParser.json());
 app.use(bodyParser.urlencoded({extended: false}));

 app.use('/api', items);

 app.all('/*', function(req, res, next) {
     // Just send the index.html for other files to support HTML5Mode
     res.sendFile(path.join(__dirname, './client', 'index.html'));
 });

 app.listen(app.get('port'), function() {
   console.log('Node app is running on port', app.get('port'));
 });

package.json（服务器端）

{
  "name": "namex",
  "version": "1.0.0",
  "description": "descx",
  "main": "server.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.15.2",
    "ejs": "^2.5.5",
    "express": "^4.14.0",
    "mongojs": "^2.4.0",
    "ng2-pagination": "^1.0.1"
  }
}

systemjs.config.js

(function (global) {
  System.config({
    paths: {
      // paths serve as alias
      'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',

  // angular bundles
  '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
  '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
  '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
  '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
  '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
  '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
  '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
  '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

  // other libraries
  'ng2-pagination':             'npm:ng2-pagination/dist/',
  'rxjs':                      'npm:rxjs',
  'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js',
  'angular2-jwt':               'node_modules/angular2-jwt/angular2-jwt.js'


},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
  app: {
    main: './main.js',
    defaultExtension: 'js'
  },
  'angular2-jwt': {
    "defaultExtension":'js'
  },
  rxjs: {
    defaultExtension: 'js'
  },  
  'ng2-pagination': {
   defaultExtension: 'js', main: 'ng2-pagination.js'
  }
}
  });
})(this);

的index.html

<!DOCTYPE html>
<html>
  <head>
    <title>ngAuth0 App</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css">


    <link rel="stylesheet" href="styles.css">
     <link href="https://fonts.googleapis.com/css?family=Philosopher" rel="stylesheet" type="text/css">
<script src="https://cdn.auth0.com/js/lock/10.6/lock.min.js"></script>

<!-- Polyfill(s) for older browsers -->

<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>  
<script src="node_modules/systemjs/dist/system.src.js"></script>

<script src="systemjs.config.js"></script>
<script>
  System.import('app').catch(function(err){ console.error(err); });
</script>
  </head>


  <body>
    <base href="/">
    <my-app>Loading ...</my-app>
  </body>
</html>

Answer 1

在部署node_modules不可用时，您应该使用应用复制polyfills。

如果您将它们复制到systemjs.config.js

所在的同一文件夹中

<script src="shim.min.js"></script>
<script src="zone.js"></script>
<script src="Reflect.js"></script>  
<script src="system.src.js"></script>

在heroku中部署Angular 2应用程序时出现错误（预期表达式，得到＆＃39;＆＃39;）

1 个答案: