vue-cli 3.0 引入mint-ui報錯問題及解決
vue-cli 3.0 引入mint-ui報錯
場景
官網(wǎng)：http://mint-ui.github.io/docs/#/zh-cn2/quickstart
npm i mint-ui -S
main.ts 文件中引入并使用
import MintUI from 'mint-ui' import 'mint-ui/lib/style.css' ? Vue.use(MintUI)
然后報錯提示：
Could not find a declaration file for module 'mint-ui'. 'E:/example/vueProjects/vmarry/node_modules/mint-ui/lib/mint-ui.common.js' implicitly has an 'any' type.
Try `npm install @types/mint-ui` if it exists or add a new declaration (.d.ts) file containing `declare module 'mint-ui';`
解決
在項目src目錄下新建一個.d.ts的文件，如：shim-mint.d.ts,內(nèi)容如下：
declare module "mint-ui" {
? const Mint: any;
? export const Toast: any;
? export const MessageBox: any;
? export default Mint;
}這樣就能正常使用啦~
mintUi在vue-cli3部分使用的問題
mint-ui在文檔上寫的部分引入組件須在.babelrc文件里改寫配置，然后vue-cli3里并沒有這個配置文件
以下是mint-ui文檔上需要增加的配置
{
? "presets": [
? ? ["es2015", { "modules": false }]
? ],
? "plugins": [["component", [
? ? {
? ? ? "libraryName": "mint-ui",
? ? ? "style": true
? ? }
? ]]]
}要想達(dá)到同樣的效果需在vue-cli3里的babel.config.js里做一個類似的配置
module.exports = {
? presets: [
? ? '@vue/app'
? ],
? plugins: [
? ? [
? ? ? "component",
? ? ? {
? ? ? ? "libraryName": "mint-ui",
? ? ? ? "style": true
? ? ? }
? ? ]
? ]
}當(dāng)然需先安裝babel-plugin-component
命令
npm install babel-plugin-component -D
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue 在methods中調(diào)用mounted的實現(xiàn)操作
這篇文章主要介紹了vue 在methods中調(diào)用mounted的實現(xiàn)操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
如何用vue-pdf包實現(xiàn)pdf文件預(yù)覽,支持分頁
這篇文章主要介紹了如何用vue-pdf包實現(xiàn)pdf文件預(yù)覽,支持分頁問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
這篇文章主要為大家介紹了Vue3通用API功能示例剖析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05
vue實現(xiàn)動態(tài)表單動態(tài)渲染組件的方式(1)
這篇文章主要為大家詳細(xì)介紹了vue實現(xiàn)動態(tài)表單動態(tài)渲染組件的方式，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
這篇文章主要介紹了Vue彈窗的兩種實現(xiàn)方式,一種使用.sync修飾符另一種使用v-model，本文通過實例代碼給大家介紹的非常詳細(xì)，需要的朋友可以參考下2022-08-08
詳解vue中$nextTick和$forceUpdate的用法
這篇文章主要介紹了詳解vue中$nextTick和$forceUpdate的用法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12
Vite 是一個面向現(xiàn)代瀏覽器的更輕,更快的web應(yīng)用開發(fā)工具,下面這篇文章主要給大家介紹了關(guān)于如何使用vite搭建vue3項目的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-07-07
Vue+ElementUI踩坑之動態(tài)顯示/隱藏表格的列el-table-column問題
這篇文章主要介紹了Vue+ElementUI踩坑之動態(tài)顯示/隱藏表格的列el-table-column問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-11-11
本篇文章主要介紹了用vue寫一個仿簡書的輪播圖的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
vue+element-ui前端使用print-js實現(xiàn)打印功能(可自定義樣式)
Print.js主要是為了幫助我們直接在瀏覽器中開發(fā)打印功能,下面這篇文章主要給大家介紹了關(guān)于vue+element-ui前端使用print-js實現(xiàn)打印功能(可自定義樣式)的相關(guān)資料,需要的朋友可以參考下2022-11-11