編寫React框架時,引入相關js庫文件不起作用

最近在學習react框架,看網上一般引入react.development.js,react-dom.development.js,babel.min.js文件都是採用

 <script src="https://unpkg.com/react@16/umd/react.development.js"></script>
 <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
 <!-- 生產環境中不建議使用 -->
 <script src="https://unpkg.com/[email protected]/babel.min.js"></script>

這種方式,但是使用這種方式的一個弊端是每次加載網頁都要去該目的地址獲取相關文件,運行速度不快,因此我就想能不能自己下來來直接引用,這是初步嘗試:

<script src="../js/react.development.js" ></script>
<script src="../js/react-dom.developemnt.js" ></script>
<script src="../js/babel.min.js" ></script>

結局是失敗了。。。刷新網頁後發現加載不出來了。。。想不通錯在了哪裏,後面發現react框架使用jsx,也是javascript的一種,但是這種文件在加載的時候需要babel進行轉換,因此我就想react需要的那三個庫文件是不是也是jsx的寫法。於是乎進行了一些改動

<script type="text/babel" src="../js/react.development.js" ></script>
<script type="text/babel" src="../js/react-dom.developemnt.js" ></script>
<script type="text/babel" src="../js/babel.min.js" ></script>

刷新網頁,成功加載!!!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章