nuxt 引入vant 報錯問題

2021-09-26 05:01:33 字數 403 閱讀 8656

1、按 描述方法引入,報錯。經查詢資料,是babel-plugin-import與nuxt不相容。有人推薦通過babel-plugin-component 代替babel-plugin-import( ,按其描述方法,仍然不行。

2、查詢其他資料,目前宣告支援nuxt的移動端ui框架只有vux。但按vux官網方法(引入後報錯,在github上查了一下,有人說是nuxt 公升級到2版本後vue-loader 版本太高原因

最終決定採用vant, 採用手動按需引入方式:

import from 'vant';

import 'vant/lib/index.css';  // 注:樣式不能按需引入,如果只是引入import 'vant/lib/toast/index.css' ,會造成部分樣式丟失。

Vant的引入方式

1 自動按需引入元件,通過babel plugin import或ts plugin import外掛程式,它會在編譯過程中將 import 的寫法自動轉換為按需引入的方式 2 手動按需引入元件 3 匯入所有元件,vant支援一次性匯入所有元件,引入所有元件會增加 包體積,因此不推薦這種做法 此外,...

Nuxt使用vant導航欄元件tabbar

按照我之前在vue cli配置方法 發現watch事件重新整理頁面沒有執行,而在vue cli卻執行 我也不想nuxt是什麼原因 機制導致的 直接換種思路 元件components tabbar.vue v model isact inactive color 666666 active color...

nuxt中全域性引入element ui

1.開啟terminal終端,輸入npm run dev啟動專案 2.element中文官方文件 3.在元件庫里任意選擇一段 複製到專案中pages資料夾下index.vue的頁面中 4.按住ctrl s儲存修改,即頁面自動顯示剛修改內容,無需重新啟動專案,可以看到此時的頁面只顯示 危險按鈕 這幾個...