国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JavaScript使用export和import的兩個報錯如何解決

3403771864 / 2176人閱讀

　　前言

　　本篇文章主要為大家敘述關(guān)于JavaScript中的export和import，這兩個常見的報錯。

　　報錯：Uncaught SyntaxError: Cannot use import statement outside a module

2022070716515454.png

　　上面標書的是無法在module以外使用import，在網(wǎng)上進行查閱之后才了解到，這是由于script標簽默認是使用JavaScript語言，使用ES6的語法會發(fā)生解析錯誤，需要在script標簽中加入type=“module”，具體如下：

　　<script type="module">
　　import Rotation from '../js/ui.js'
　　Rotation();
　　</script>

　　仔細看，這樣就不會出現(xiàn)報錯吧。

　　報錯：Uncaught SyntaxError: The requested module ‘…/js/ui.js’ does not provide an export named ‘default’

　　第一錯誤解決了，但隨之而來的是控制臺又拋出了第二個錯誤：

2.png

　　現(xiàn)在我來說說我的，目標JS文件中沒有default導出，因此，我的JS文件就是這樣：

　　function Rotation() {
　　let lbt = document.querySelectorAll('.zh-lbt');
　　for (let i = 0; i < lbt.length; i++) {
　　let lbtNum = Number(lbt[i].getAttribute('num'))||1
　　console.log(lbtNum);
　　}
　　}
　　export {Rotation};

　　常規(guī)來說沒啥問題，export default和export只是暴露目標數(shù)有區(qū)別，因此不會是語法報錯，是不是我的引入出現(xiàn)問題，隨之做出下來改變

　　<script type="module">
　　import Rotation from '../js/ui.js'
　　Rotation();
　　</script>

　　加了一個大括號{}，修改為了

　　<script type="module">
　　import {Rotation} from '../js/ui.js'
　　Rotation();
　　</script>

　　發(fā)現(xiàn)果然控制臺沒有報錯，并出現(xiàn)了結(jié)果

3.png

　　這個問題我認為其原因是export語法可以向外暴露多個目標，所以在引入時需要通過“{}”以對象經(jīng)行引入，export default只能向外暴露一個，所以可以不用寫{}。

　　可卻不是。

　　在改為export default后，才發(fā)現(xiàn)export default在引入時，不能加{}，否則會報錯。

　　export default{
　　Rotation:function () {
　　let lbt = document.querySelectorAll('.zh-lbt');
　　for (let i = 0; i < lbt.length; i++) {
　　let lbtNum = Number(lbt[i].getAttribute('num'))||1
　　console.log(lbtNum);
　　}
　　}
　　}
　　<script type="module">
　　import {Rotation} from '../js/ui.js'
　　Rotation.Rotation();
　　</script>

　　此時控制臺會報錯

4.png

　　同理此時只要去掉“{}”，就不會報錯了，并能正確打印上面的結(jié)果。

      歡迎大家關(guān)注更多精彩內(nèi)容！

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/130288.html

相關(guān)文章

  • ES6新特性總結(jié) 一

    摘要：一旦聲明，常量的值不能被改變。頂層對象的屬性頂層對象，瀏覽器中指的是對象，在中指的是對象。中新增了兩個命令和，命令用于暴露出模塊對外的接口，而則用于輸入某一模塊。 1.聲明變量的關(guān)鍵字：const 和 let JavaScript ES6中引入了另外兩個聲明變量的關(guān)鍵字：const和let。在ES6中，我們將很少能看到var了。 const關(guān)鍵字 const聲明一個只讀的常量。一旦聲明...

    MarvinZhang 評論0 收藏0

  • Javascript ES6學習

    摘要：以下簡稱是語言的下一代標準。因為當前版本的是在年發(fā)布的，所以又稱。命令用于規(guī)定模塊的對外接口，命令用于輸入其他模塊提供的功能。需要特別注意的是，命令規(guī)定的是對外的接口，必須與模塊內(nèi)部的變量建立一一對應關(guān)系。 ECMAScript 6（以下簡稱ES6）是JavaScript語言的下一代標準。因為當前版本的ES6是在2015年發(fā)布的，所以又稱ECMAScript 2015。 最常用的ES6...

    gclove 評論0 收藏0

  • 很全很全的JavaScript的模塊講解

    摘要：該模塊實現(xiàn)方案主要包含與這兩個關(guān)鍵字，其允許某個模塊對外暴露部分接口并且由其他模塊導入使用。由于在服務端的流行，的模塊形式被不正確地稱為。以上所描述的模塊載入機制均定義在中。 最近一直在搞基礎(chǔ)的東西，弄了一個持續(xù)更新的github筆記，可以去看看，誠意之作（本來就是寫給自己看的……）鏈接地址：Front-End-Basics 此篇文章的地址：JavaScript的模塊 基礎(chǔ)筆記...

    lufficc 評論0 收藏0

  • 2020年如何寫一個現(xiàn)代的JavaScript庫

    摘要：我寫過一些開源項目，在開源方面有一些經(jīng)驗，最近開到了阮老師的微博，深有感觸，現(xiàn)在一個開源項目涉及的東西確實挺多的，特別是對于新手來說非常不友好最近我寫了一個，旨在從多方面快速幫大家搭建一個標準的庫，本文將已為例，介紹寫一個開源庫的知識 我寫過一些開源項目，在開源方面有一些經(jīng)驗，最近開到了阮老師的微博，深有感觸，現(xiàn)在一個開源項目涉及的東西確實挺多的，特別是對于新手來說非常不友好 show...

    joyqi 評論0 收藏0

  • ES6之路之模塊詳解

    摘要：例如我們導入模塊，可以這么導入桃翁歡迎關(guān)注公眾號前端桃園報錯不能定義相同名字變量報錯，不能重新賦值小豬可以看到導入綁定這里不理解綁定，文章后面會解釋時，形式類似于對象解構(gòu)，但實際上并無關(guān)聯(lián)。 歡迎訪問個人站點 簡介 何為模塊 一個模塊只不過是一個寫在文件中的 JavaScript 代碼塊。 模塊中的函數(shù)或變量不可用，除非模塊文件導出它們。 簡單地說，這些模塊可以幫助你在你的模塊中編寫...

    huashiou 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<