Question

我正在尝试在Chrome中使用ES6模块。从我看过的所有示例中，以下内容似乎是正确的方法，但是当我在Chrome开发人员工具中运行它时，出现此错误消息...

未捕获的SyntaxError：意外令牌{

...突出显示试图导入模块的模块（下面的script1.js）中的import语句。我已经看到过很多类似这样的问题的参考，但是没有任何补救这种情况的建议对我有用。如果您能看到我做错了什么，我一定会感谢您的帮助...

这是html ...

<html>
<head>
    <script src="lib1.js" type="module"></script>
    <script src="script1.js"></script>
</head>
<body>
</body>
</html>

这是模块（lib1.js）...

export function doSomething() {
    alert("in module lib1");
}

这是试图导入模块的脚本（script1.js）...

import { doSomething } from "lib1.js";
doSomething();

Answer 1

编辑： 在大约一个小时的挠头之后，发现我的答案（预编辑）被否决了，我明白了：

lib.js：

private class ConnectThread extends Thread {
    private final BluetoothSocket mmSocket;
    private final BluetoothDevice mmDevice;
    private String mSocketType;

    public ConnectThread(BluetoothDevice device, boolean secure) {
        mmDevice = device;
        BluetoothSocket tmp = null;
        mSocketType = secure ? "Secure" : "Insecure";

            try {
                if (secure) {
                    tmp = device.createRfcommSocketToServiceRecord(UUID_SPP);
                } else {
                    UUID mUUID= device.getUuids()[0].getUuid();
                    tmp = device.createInsecureRfcommSocketToServiceRecord(mUUID);
                }
            } catch (IOException e) {
                Log.e(TAG, "Socket Type: " + mSocketType + "create() failed", e);
            }
        mmSocket = tmp;
        mState = STATE_CONNECTING;
    }

script.js：

function doSomething() {
    console.log('in module lib');
}
export {doSomething};

index.html：

import { doSomething } from './lib.js';
doSomething();

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> <body> <script type="module" src="script.js"></script> </body> </html>，lib.js和script.js在同一目录中。

我将index.html添加到了.js，因为否则它不起作用。根据{{3}}，某些捆绑软件可能允许或要求对import { doSomething } from './lib.js';使用扩展名。

但这仅适用于Firefox Quantum（版本62.0.3）。我在以下版本的Chrome（版本70.0.3538.77）上启用了实验JavaScript ：

chrome：// flags /＃enable-javascript-harmony

没有成功的迹象，但是考虑到这在Firefox上有效，并且 Mozilla表明Chrome和Firefox处于相同的兼容性水平，这让我更加困惑，因此我可能最终会就整个问题提出疑问。

Answer 2

谢谢，它终于对我有用，尽管起初这确实让我感到困惑！

如果有人感兴趣，有两处令人困惑的事情，他们绕了一圈走了一圈后终于对我有用：

您将type="module"添加到模块导入到的<script>中，不是。实际上， index.html 文件中只有一个 <script>。然后，仅从 index.js 文件中导入模块。
您需要将文件扩展名为 index.js ，例如：

import search from "./search.js";

我在Firefox上尝试过此操作。

Answer 3

您的代码在任何浏览器中均不起作用。这是正确的方法：

index.html

<html>
<head>
    <script src="script.js" type="module"></script>
</head>
<body>
</body>
</html>

lib.js

export function doSomething() {
    alert("in module lib1");
}

script.js

import { doSomething } from "./lib.js";
doSomething();

Answer 4

<script src="script.js" type="module"></script>是关键……对于Chrome中的错误消息感到羞耻

Chrome中的ES6模块

4 个答案:

index.html

lib.js

script.js