vue3 0中i18n國際化外掛程式的使用

2021-10-13 12:44:14 字數 1512 閱讀 2098

記錄在學習vue3.0是新增i18n國際化翻譯功能以及遇到的問題。

在vue3.0 中使引用 i18n 時一直報錯原因：請檢查版本問題！請檢查版本問題！請檢查版本問題！目前我使用的"vue-i18n": 「^9.0.0-beta.17」,版本開始相容vue3.0。

//安裝最新的版本 @next


步驟1:安裝vue-i18n


npm install vue-i18n@next
步驟2:建立language資料夾存放各版本語言變數


language 中 index.js


//語言


import


from


'vue-i18n'


//引入vue-i18n元件


// import  from 'vue-i18n'


//註冊i8n例項並引入語言檔案


const i18n =


createi18n(}


)export


default i18n;


//將i18n暴露出去，在main.js中引入掛載


language 中 ch.js


module.exports =


}
language 中 en.js


module.exports =


}
main.js中掛載


import


from


"vue";;


import router from


"./router"


;import store from


"./store"


;import antd from


'ant-design-vue'


;import


'ant-design-vue/dist/antd.css'


;import vuei18n from


'./language'


.use


(store)


.use


(router)


.use


(antd)


.use


(vuei18n)


.mount()


;
使用方式


//格式為 $t('變數')


}
				
vue3 0中i18n國際化外掛程式的使用
自 後續為自行補充 記錄在學習vue3.0是新增i18n國際化翻譯功能以及遇到的問題。步驟1 安裝vue i18n npm install vue i18n next 步驟2 建立language資料夾存放各版本語言變數 language 中 index.js 語言 import from vue ...

				
react Taro 使用i18n國際化
npm install react i18next i18next i18next browser languagedetector 新建index.jsx import languagedetector from i18next browser languagedetector import i1...

				
vue 國際化i18n 多語言切換
安裝 npm install vue i18n 新建乙個資料夾 i18n 內新建 en.js zh.js index.js 三個檔案 準備翻譯資訊 en.js export default zh.js export default index.js 建立vue i18n例項 import vue f...