vue的类库vux安装

本文详细介绍了在CLI环境下如何安装和配置VUX类库,包括必要的vux-loader和less-loader的安装步骤,以及如何在webpack配置文件中进行相应设置,确保VUX组件的正确使用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

avatar

cli环境中安装vux类库

  1. npm install vux --save
  2. 安装vux-loader (这个vux文档似乎没介绍,当初没安装结果报了一堆错误)

    1
    
    npm install vux-loader --save-dev
    
  3. 安装less-loader (这个是用以正确编译less源码,否则会出现 ‘ Cannot GET / ‘)

    1
    
    npm install less less-loader --save-dev
    
  4. vux2必须配合vux-loader使用, 请在build/webpack.base.conf.js里参照如下代码进行配置:

    const vuxLoader = require(‘vux-loader’)
    const webpackConfig = originalConfig 将原来的 module.exports 代码赋值给变量 webpackConfig (也就是将原文件的module.exports改为let webpackConfig)

  5. 在文件最后一行复制下面代码

    1
    2
    3
    
    module.exports = vuxLoader.merge(webpackConfig, {
            plugins: ['vux-ui']
    })
    
  6. 在入口文件全局引入

    1
    2
    
    import Vue from 'vue'
    import { XButton } from 'vux'
    

例:

1
Vue.component('x-button', XButton)

使用

1
<x-button></x-button>

vux样式改变,可以在APP.vue中用样式覆盖,在组件内用scoped无法覆盖

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值