导入ECMAScript 6时“Uncaught SyntaxError: Cannot use import statement outside a module”

我正在使用ArcGIS JSAPI 4.12，希望使用空间幻象在地图上绘制军事符号。

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

无法在模块外部使用import语句

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

Uncaught ReferenceError: ms未定义

这是我的代码:

<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 };

当前回答

因为你没有输出。.ts文件需要导出类格式，而在.js文件中，我们将使用exports函数。

因此，我们必须使用var_name = require("<pathfile>")来使用这些文件函数。

2021-03-24 18:58:05

其他回答

我不得不从一个外部文件(JavaScript文件)导入一些数据，到我的script.js文件中呈现在我的HTML文件中。

文件data.js

const data = {a: 1, b: 2}

通过添加type=module，我得到了CORS错误。

我发现我可以导入文件data.js到我的script.js文件，只需包括文件data.js在我的HTML文件。

例如，以前我的HTML文件由

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

因为我需要一些数据从文件data.js，我只是把我的HTML文件更改为:

<script src="assets/data.js"></script>
<script src="assets/script.js"></script>

也就是说，在script.js文件之前包含data.js文件，允许访问script.js文件中的数据变量。

2022-01-15 11:40:19

我得到了这个错误，因为我忘记了脚本标签中的type="module":

<script type="module" src="milsymbol-2.0.0/src/milsymbol.js"></script>

2019-11-03 10:43:50

我在尝试使用import Express.js时遇到了这个错误。

而不是从'express'进口express;

我使用const express = require('express');

2021-06-05 12:36:52

提供的答案都不适合我，但我找到了一个不同的解决方案:如何在Node.js中启用ECMAScript 6导入

安装ESM:

npm install --save esm

使用ESM运行:

node -r esm server.js

2021-10-11 16:27:16

对我来说，我不想更新我的包。Json文件，并将文件类型更改为mjs。

所以我四处寻找，发现在tsconfig文件中更改模块。Json会影响结果。我的ts.config文件是:

{
  "compilerOptions": {
    "target": "es2020",
    "module": "es2020",
    "lib": [
      "es2020",
    ],
    "skipLibCheck": true,
    "sourceMap": true,
    "outDir": "./dist",
    "moduleResolution": "node",
    "removeComments": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "noImplicitThis": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "baseUrl": "."
  },
  "exclude": [
    "node_modules"
  ],
  "include": [
    "./src/**/*.ts"
  ]
}

像这样，将模块从"module": "es2020"改为"module": "commonjs"解决了我的问题。

我正在使用MikroORM，并认为它可能不支持任何CommonJS以上的模块。

2021-07-25 10:53:29

导入ECMAScript 6时“Uncaught SyntaxError: Cannot use import statement outside a module”

推荐文章

最新文章

标签