Импортирование классов приводит к ошибке: необработанный синтаксический ошибка неожиданный идентификатор - PullRequest
1 голос
/ 30 июня 2019

Я пытаюсь импортировать свой Java Class yellow.js в мой index.js и получаю

"Неизвестный непредвиденный идентификатор синтаксической ошибки"

после некоторого поиска в Google мне предлагают изменить мой

<script src="src/index.js"></script>

в

<script type="module" src="src/index.js"></script>

но это приводит к:

Доступ к сценарию в 'file: /// D: /Game/src/index.js' из источника 'null' была заблокирована политикой CORS: только запросы на разные источники поддерживается для протокольных схем: http, data, chrome, chrome-extension, HTTPS

Мой код выглядит сейчас так:

index.html

    <html>

    <head>
        <title>Title</title>
        <meta charset="UTF-8">

        <style>
            #gameScreen {
                border: 1px solid black;
            }
        </style>

    </head>

    <body>
        <canvas id="gameScreen" width='600' height='600'></canvas>
        <script type="module" src="src/index.js"></script>
    </body>

    </html>

index.js

    import Yellow from "/src/yellow";

    let canvas = document.getElementById("gameScreen");
    let ctx = canvas.getContext("2d");


    let yellow = new Yellow();
    yellow.draw();

yellow.js

    export default class yellow{
      draw(ctx) {
            ctx.fillStyle = '#ff0';
            ctx.fillRect(20, 20, 100, 50);
        }
    }

Я что-то пропустил?

Я не совсем понял, где и как добавить "type="module" вещь.

1 Ответ

2 голосов
/ 30 июня 2019

В браузерах имена модулей должны иметь свои расширения (например, yellow.js, а не yellow), если они не указаны в карте модулей для вашей страницы; относительные ссылки на модули должны начинаться с ./ или ../ (чтобы отличать их от ссылок на модули, перечисленные в карте модулей).

Так что, если вы не используете карту модуля, это

import Yellow from "/src/yellow";

должно быть

import Yellow from "./yellow.js";

Это ./, потому что index.js и yellow.js находятся в одном и том же месте, и относительный путь относится к модулю, выполняющему импорт (index.js), а не к HTML, который импортировал этот модуль.


Re ошибка, которую вы получаете, когда вы используете type="module" (что вы должны сделать):

Это приводит к этой ошибке:

Доступ к сценарию в 'file: /// D: /Game/src/index.js' из источника 'null' был заблокирован политикой CORS: Запросы перекрестного происхождения поддерживаются только для схем протоколов: http, data, хром, расширение хром, https.

Большинство браузеров не позволяют вам делать это с URL file://, хотя Firefox делает. Однако даже при использовании Firefox лучше всего использовать локальный веб-сервер для веб-разработки, поскольку многие вещи либо заблокированы, либо ведут себя иначе, чем file:// URL-адреса против http:// и https:// URL-адресов. В вашей IDE может быть встроен один из них, или достаточно просто установить Apache или nginx локально, или вы можете свернуть свой собственный с Node.js и Express или Koa .

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