Изменение angular.json Angular 6+ для корректной загрузки скриптов в index.html - PullRequest
0 голосов
/ 03 января 2019

Я запускаю угловой проект на моем компьютере:

Angular CLI: 7.1.4 Узел: 11.6.0 ОС: darwin x64 Angular: 7.1.4

Я обновил угловой с4.5.5 до 7.1.4.

Теперь я получаю следующую ошибку в своей консоли в браузере Chrome:

9 GET http://localhost:3000/runtime.js net :: ERR_ABORTED 404(Не найдено)

Так что он не может найти скрипт в моем index.html (см. Ниже)

Но когда я смотрю на свою папку в моей среде разработчика, яможет найти файлы, и путь кажется правильным:

Screenshot Folder Public! [две куклы] [1]

Мой бэкэнд находится в Node.js, и файл app.js выглядит следующим образом:

const express = require('express');

const router = require('./router'),
    templates = require('./views/templates');

// Setup
const app = express();
const port = process.env.PORT || 3000;
router(app);

templates.initSync();

// Start server
app.listen(port, function () {
    console.log('Kommis back-end is running on port', port);
});

// Catch unhandled promise rejections, see
// https://nodejs.org/dist/latest-    v8.x/docs/api/process.html#process_event_unhandledrejection
process.on('unhandledRejection', (err) => {
        console.log(err.stack);
    });

module.exports = app;

Это мой файл index.html:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Digitaler Tischplan</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.png">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</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>

Я понял, что мне нужно добавить базовую ссылку gen/, чтобы она работала!

Но как я могу изменить вывод сгенерированного углового кода, чтобы он работал, не изменяя его впоследствии?

Я посмотрел, прежде чем я Angular обновил сценарии в index.htmlфайлсказано так:

gen/scriptname.js

Почему он больше этого не делает?

Это мои первые строки angular.json:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "angular-src": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
             "outputPath": "../public/gen/",
             "index": "src/index.html",
             "main": "src/main.ts",
             "tsConfig": "src/tsconfig.app.json",
             "polyfills": "src/polyfills.ts",
              "assets": [
                "src/assets",
                "src/favicon.ico"
             ],
              "styles": [
               "src/css/main.scss"
              ],
              "scripts": []
            },

Чтобы правильно построить угловое приложение, мне нужно было gen/ в index.html в angular-src.

...