如何使用導入和導出在瀏覽器中進行本地測試

Question

根據如何在另一個 JavaScript 文件中包含 JavaScript 文件？ ，瀏覽器已經支持直接加載 ECMAScript 模塊。

那么為什么這在我的本地計算機上不起作用

索引.html

<!DOCTYPE html>
<html>
<head>
    <meta charset='utf-8'>
    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
    <title>Page Title</title>
    <meta name='viewport' content='width=device-width, initial-scale=1'>
</head>
<body>
    
    <script type="module">
        import { hello } from './hello.js'; // Or the extension could be just `.js`
        hello('world');
      </script>

</body>
</html>

你好.js

export function hello(text) {
    alert(text);
}

控制台不斷給我 CORS 錯誤

CORS 策略已阻止從源“null”訪問“file:///C:/Users/Dave/Desktop/JavascriptImportExport/hello.js”處的腳本：跨源請求僅支持協議方案：http，數據，鍍鉻，鍍鉻擴展，勇敢，鍍鉻不受信任，https。

Answer 1

您不能從file://協議 URL 加載模塊。

為此，您需要一個 web 服務器。 如果您正在使用 VS Code 並且只需要一個網絡服務器來測試和學習，我建議您安裝Live Server擴展。

錯誤消息已經告訴您：

Cross origin requests are only supported for protocol schemes: 
http, data, chrome, chrome-extension, brave, chrome-untrusted, https.

如何使用導入和導出在瀏覽器中進行本地測試

問題描述

1 個解決方案

解決方案1
1 已采納 2022-07-29 19:00:25

如何使用導入和導出在瀏覽器中進行本地測試

問題描述

1 個解決方案

解決方案1 1 已采納 2022-07-29 19:00:25

解決方案1
1 已采納 2022-07-29 19:00:25