Angular - Неожиданный токен - PullRequest
0 голосов
/ 26 августа 2018

Я настроил угловое и экспресс-приложение с командными строками angular-cli и express соответственно.Я уже создал угловое приложение с ng build, и когда я хочу использовать его на экспресс-сервере, я получаю следующую ошибку в консоли Google Chrome:

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

вот мой файл server.js:

.
.
.
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/users', usersRouter);
app.use('/auth', authRouter);

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

index.html file:

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Client</title>
  <base href="./">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>

<body>
  <app-root></app-root>
  <script type="text/javascript" src="runtime.js"></script>
  <script type="text/javascript" src="polyfills.js"></script>
  <script type="text/javascript" src="styles.js"></script>
  <script type="text/javascript" src="vendor.js"></script>
  <script type="text/javascript" src="main.js"></script>
</body>

</html>

Нет проблем с ng serve, и приложение будет работать без сбоев, а также, когда я просто открываю index.html в браузере, оно также работает, я думаюэто как-то относится к экспресс-серверу.

Ответы [ 3 ]

0 голосов
/ 22 сентября 2018

Как сказал Матеуш, все ваши запросы возвращают файл index.html.Если вы откроете инструменты разработчика в Chrome и перейдете на вкладку «Сеть» и просмотрите ответы для каждого из этих файлов, вы увидите, что содержимое каждого из этих файлов на самом деле является файлом index.html.Вам нужно создать список исключений, чтобы сервер мог возвращать эти файлы js и файлы других типов, например изображения.

const allowed = [
  '.js',
  '.css',
  '.png',
  '.jpg'
];

// Catch all other routes and return the angular index file
app.get('*', (req, res) => {
   if (allowed.filter(ext => req.url.indexOf(ext) > 0).length > 0) {
      res.sendFile(path.resolve(`client/dist/cient/${req.url}`));
   } else {
      res.sendFile(path.join(__dirname, 'client/dist/client/index.html'));
   }
});
0 голосов
/ 05 июля 2019

Я просто исправил подобную проблему, переместив мой файл server.js из папки DIST в указанную выше папку.

Итак, моя структура папок / файлов выглядит следующим образом:

  • webroot - корневая папка

    • server.js

    • dist (папка)

      • браузер (подпапка)

      • сервер (подпапка)

0 голосов
/ 26 августа 2018

Я думаю, проблема в том, что ваши файлы скриптов загружаются из корневого уровня, делая ваш браузер запросом http://example.com/XXX.js.Вот почему они попадают в маршрут Экспресса *.Это означает, что каждый запрос к XXX.js получает один и тот же файл index.html, который не может быть должным образом проанализирован механизмом JS.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...