Пытаюсь использовать ES6, но я застрял на чем-то.Чтобы упростить задачу, есть две проблемы:
- Исходный код JS не выполняется в скрипте с именем
module="type"
HTMLelements - , импорт напрямую из index.html возвращает
SyntaxError: fields are not currently supported
Пробовал и копал оба дела, не могу понять, что не так.Пути верны.Не помещая расширение .js
в from
, оператор возвращал ошибки для второй попытки с импортом, использованным непосредственно в index.html
.Ранее initGame()
был $(document).ready(function(e) { ... });
.Также выдает ошибку, если я не разделяю type="module"
внутри index.html
.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Content-Language" content="en">
<title></title>
<link rel="stylesheet" href="design/css/main.css">
</head>
<body>
<main id="displayer">
</main>
</body>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="module">
import { initGame } from "./lib/js/core.js";
initGame();
</script>
<script type="application/javascript, module" src="./lib/js/core.js"></script>
</html>
//core.js
import { Board } from './classes/Board.js';
import { Pawn } from './classes/Pawn.js';
export function initGame () {
console.log("plop");
var $displayer = $('#displayer');
var board = new Board($displayer, 32, 19, 19, ['#ffffcc', '#333333']);
console.debug(board);
}
//Board.js
import { TileMap } from "./TileMap.js"
export class Board extends TileMap
{
_tileColors;
constructor(wrapper, tileSize, columnsNb, rowsNb, tileColors) {
super(wrapper, tileSize, columnsNb, rowsNb);
this._name = "Board:" + columnsNb + ":" + rowsNb;
this.selector.css({
class: "board"
})
tileColors.forEach(function(color, i) {
this._tileColors[i] = color;
});
this.colorize();
}
colorize() {
this._grid.forEach(function(col, i) {
col.forEach( function(tile, j) {
tile.color = ((i + j) % 2 === 0) ? this.getColor(0) : this.getColor(1);
});
});
}
getColor(index) {
return this._tileColors[index];
}
}
Просто хочу использовать систему модуляции ES6 для удобства и самообучения.
Ошибки:
- Если нет
type="module" src="path"
указано: SyntaxError: import declarations may only appear at top level of a module
- пустая консоль, если просто
<script type="module">
и $(document).ready()
вариант для core.js
- Если эта версия активна:
SyntaxError: fields are not currently supported