Question

我有一个Angular 5+应用程序，在使用ng serve --aot时可以正常运行，但当我ng build --aot && node app.js时，我在浏览器中遇到以下错误：

Uncaught SyntaxError: Unexpected token <            runtime.js:1 
Uncaught SyntaxError: Unexpected token <            polyfills.js:1 
Uncaught SyntaxError: Unexpected token <            styles.js:1 
Uncaught SyntaxError: Unexpected token <            vendor.js:1 
Uncaught SyntaxError: Unexpected token <            main.js:1

以下是我的服务器代码和依赖项。

app.js：

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

// import environmental variables from our variables.env file
require('dotenv').config({ path: 'variables.env' });

// Get our API routes
const api = require('./server/routes/api');

const app = express();

// Parsers for POST data
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

// Point static path to dist
app.use(express.static(path.join(__dirname, 'dist')));

// Set our api routes
app.use('/api', api);

// Catch all other routes and return the index file
app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});

// Get port from environment and store in Express.
const port = process.env.PORT || '3000';
app.set('port', port);

// Create HTTP server.
const server = http.createServer(app);

// Listen on provided port, on all network interfaces
server.listen(port, () => console.log(`Server running on localhost:${port}`));

package.json依赖项

"dependencies": {
    "@angular/animations": "^6.0.3",
    "@angular/common": "^6.0.3",
    "@angular/compiler": "^6.0.3",
    "@angular/core": "^6.0.3",
    "@angular/forms": "^6.0.3",
    "@angular/http": "^6.0.3",
    "@angular/platform-browser": "^6.0.3",
    "@angular/platform-browser-dynamic": "^6.0.3",
    "@angular/router": "^6.0.3",
    "angular-font-awesome": "^3.1.2",
    "body-parser": "^1.18.3",
    "bootstrap": "^4.1.1",
    "buttercms": "^1.1.1",
    "core-js": "^2.5.4",
    "cosmicjs": "^3.2.10",
    "dotenv": "^6.0.0",
    "express": "^4.16.3",
    "font-awesome": "^4.7.0",
    "http": "0.0.0",
    "ngx-bootstrap": "^3.0.0",
    "ngx-editor": "^3.3.0",
    "path": "^0.12.7",
    "rxjs": "^6.0.0",
    "rxjs-compat": "^6.2.1",
    "zone.js": "^0.8.26"
  },

有没有其他人遇到过这个错误，也许知道我在这里做错了什么？

Answer 1

<意外字符通常表示它接收HTML，例如404页或500页。您可以尝试导航到这些网址并查看它们。可能，这些文件的路径在webserver和ng服务之间是不同的。我会尝试找到这些文件实际托管的URL，并查看建议正确的基本href的建议。已经有一段时间了，因为我已经查看了设置基本href的规范，尽管this question是最近的，似乎涵盖了这个主题。

祝你好运！

Answer 2

问题出在您的前端部分。这与您的nodejs代码无关。

在ng构建之后，转到dist /您的项目文件夹，说“某事”。然后打开index.html文件并更改默认的基本URL。

如果您将项目文件夹放在nginx或apache上，则您的基本URL应该是

<base href="http://localhost/something/">

在我的情况下，Angular的版本为：7.1.4

Angular 5+ ng服务正常但ng build会产生浏览器错误

2 个答案: