vue使用vux(配置vux常見問題)

準備:
首先,通過腳手架先初始一個項目test
然後運行沒問題。

配置:

  1. 下載 npm i vux
  2. 使用一個按鈕這個組件,爲了方便在vue中的使用,將其配置爲公共的組件使用:
    在mian.js 中:
import {XButton } from 'vux'
Vue.component('x-button',XButton );

在home.vue中使用x-XButton;(使用方式文檔中都有代碼,在demo源碼的位置)
3. 運行
報錯:

These dependencies were not found:!!vue-style-loader!css-loader?{“sourceMap”:true}

在這裏插入圖片描述
在這裏插入圖片描述
這裏是說依賴找不到,這種情況下檢查一下我vue-style-loader css-loader都是有的,問題在於vux使用了less,文檔其實有說,如下圖
在這裏插入圖片描述
腳手架並不會配less,所以這裏我們下載配置一下less,npm i less less-loader -s;
運行報錯:

You may need an appropriate loader to handle this file type.

在這裏插入圖片描述

其實這裏是因爲我們少了配置,這個在vux的文檔中也有說:
在這裏插入圖片描述
所以下載一下 vux-loader ,然後在webpack.base.config.js中配置一下;
原來的 module.exports 代碼賦值給變量 webpackConfig,如下:
在這裏插入圖片描述
配置後如圖:
在這裏插入圖片描述
然後運行,成功,home使用按鈕也正常
在這裏插入圖片描述

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