оператор 'import' не работает в скрипте в отображаемом HTML - PullRequest
Новая
       7

оператор 'import' не работает в скрипте в отображаемом HTML

0 голосов
/ 01 февраля 2019

Я разрабатываю экспресс-приложение, и я пытаюсь сделать следующее, и постоянно получаю одну и ту же ошибку - "GET http://localhost:3000/javascript/module2 net :: ERR_ABORTED 404 (Not Found)"

Может ли кто-нибудь указать мне, какую ошибку я совершаю, и указать мне правильное направление?Ниже мой код -

Module1.js 

import theFunc from "./module2";
console.log("In module 1");
theFunc();

Module2.js 

export default function theFunc() {
console.log("from module 2");
}

index.html 

<html>
 <body>
   Should show the result in console.
  <script type="module" src="./javascript/module1.js"></script>
 </body>
</html>

Заранее огромное спасибо!:)

Ответы [ 2 ]

0 голосов
/ 01 февраля 2019

В сообщении указывается на проблему, но ее все равно довольно легко пропустить. 

GET http://localhost:3000/javascript/module2 net::ERR_ABORTED 404

- это проблема, потому что вместо 

http://localhost:3000/javascript/module2

URL-адрес на самом деле 

http://localhost:3000/javascript/module2.js

с расширением .js.

Проблема в том, что 

import theFunc from "./module2";

должно быть 

import theFunc from "./module2.js";
0 голосов
/ 01 февраля 2019

Операторы импорта и экспорта относятся к ES6 , поэтому вам необходимо использовать такой транспортер, как Babel.Второй вариант - использовать require, что эквивалентно ES5:

Сначала добавьте этот скрипт в заголовок вашего HTML: 

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js"></script>
</head>
<body>

Измените эти строки: 

import theFunc from "./module2";

становится 

 var theFunc = require("./module2");

и этот тоже: 

export default function theFunc() {
console.log("from module 2");
}

становится: 

function theFunc() {
console.log("from module 2");
}
module.exports = theFunc;
...