我正在使用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 };

当前回答

如果您想对模块使用import而不是require(),请更改或添加package中的type值到module。json文件

例子:

包中。json文件

{
  "name": "appsample",
  "version": "1.0.0",
  "type": "module",
  "description": "Learning Node",
  "main": "app.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Chikeluba Anusionwu",
  "license": "ISC"
}
import http from 'http';

var host = '127.0.0.1',
    port = 1992,
    server = http.createServer();

server.on('request', (req, res) => {
  res.writeHead(200, {"Content-Type": "text/plain"});
  res.end("I am using type module in package.json file in this application.");
});

server.listen(port, () => console.log(
    'Listening to server ${port}. Connection has been established.'));

其他回答

为什么会出现这种情况以及更多可能的原因:

很多接口仍然不理解ES6 JavaScript语法/特性。因此,无论在任何文件或项目中使用ES6,都需要将ES6编译为ES5。

出现SyntaxError:不能在模块外使用import语句错误的可能原因是您试图独立运行该文件。您还没有安装和设置ES6编译器(如Babel),或者您的runscript中的文件路径是错误的/不是编译文件。

如果你想继续没有编译器,最好的解决方案是使用ES5语法,在你的情况下,这将是var ms = require(./ms.js);。这可以稍后更新为适当或更好的仍然设置你的编译器,并确保你的文件/项目在运行之前编译,也确保你的运行脚本正在运行编译文件,通常命名为dist, build或任何你命名的文件,在你的runscript中编译文件的路径是正确的。

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

而不是从'express'进口express;

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

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

安装ESM:

npm install --save esm

使用ESM运行:

node -r esm server.js

我不得不从一个外部文件(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文件中的数据变量。

有几种常见的方法可以解决与上述问题相关的冲突


1. 第一个:在脚本中,包含type=module

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

2. 第二种:在node.js中,放入你的包中。json文件

    {
       
        "type": "module",
       
    }

重新启动项目npm start


3.第三:按要求替换导入

试试这个

import { parse } from 'node-html-parser';
parse = require('node-html-parser');

否则试试这个

//import { parse } from 'node-html-parser';
parse = require('node-html-parser');