javascript - 导入 ECMAScript 6 时为 "Uncaught SyntaxError: Cannot use import statement outside a module"

Question

我正在使用 ArcGIS JSAPI 4.12 并希望使用 Spatial Illusions在 map 上绘制军事符号。

当我将 milsymbol.js 添加到脚本中时，控制台返回错误

Uncaught SyntaxError: Cannot use import statement outside a module`

所以我将 type="module" 添加到脚本中，然后它返回

Uncaught ReferenceError: ms is not defined

这是我的代码:

<link rel="stylesheet" href="https://js.arcgis.com/4.12/esri/css/main.css">
<script src="https://js.arcgis.com/4.12/"></script>
<script type="module" src="milsymbol-2.0.0/src/milsymbol.js"></script>

<script>
    require([
        "esri/Map",
        "esri/views/MapView",
        "esri/layers/MapImageLayer",
        "esri/layers/FeatureLayer"
    ], function (Map, MapView, MapImageLayer, FeatureLayer) {

        var symbol = new ms.Symbol("SFG-UCI----D", { size: 30 }).asCanvas(3);
        var map = new Map({
            basemap: "topo-vector"
        });

        var view = new MapView({
            container: "viewDiv",
            map: map,
            center: [121, 23],
            zoom: 7
        });
    });
</script>

所以，无论我是否添加type="module"，总是会出现错误。然而，在Spatial Illusions的官方文档中，脚本中并没有任何type="module"。我现在真的很困惑。他们如何在不添加类型的情况下使其工作？

文件milsymbol.js

import { ms } from "./ms.js";

import Symbol from "./ms/symbol.js";
ms.Symbol = Symbol;

export { ms };

Answer 1

Node.js/NPM 更新

添加"type": "module"给您package.json文件。

{
  // ...
  "type": "module",
  // ...
}

注意:使用模块时，如果出现 ReferenceError: require is not Defined，则需要使用 import syntax而不是require 。您本身无法在它们之间混合和匹配，因此您需要选择一个或 use a bundler if you need to use both .