À propos du guide de configuration de Vue (tutoriel détaillé)

Vux est une bibliothèque d'interface utilisateur de Vue.js. Le site officiel est ici. Le guide de configuration du document officiel se concentre sur la liste des technologies. Amis intéressés, suivez l'éditeur de Script House pour apprendre ensemble

Introduction

Vux (prononciation [v'ju:z], le identique aux vues) est une bibliothèque de composants d'interface utilisateur mobile développée sur la base de WeUI et Vue (2.x), qui sert principalement les pages WeChat.

Basé sur webpack+vue-loader+vux, vous pouvez développer rapidement des pages mobiles avec vux-loader, vous pouvez personnaliser les styles dont vous avez besoin en fonction de WeUI.

vux-loader garantit que les composants sont utilisés à la demande, vous n'avez donc pas à vous soucier d'emballer éventuellement l'intégralité du code de la bibliothèque de composants vux.

vux ne dépend pas entièrement de WeUI, mais essayez de garder le style global de l'interface utilisateur proche des spécifications de conception de WeUI. L'objectif initial était de créer une bibliothèque de composants d'interface utilisateur mobile facile à utiliser, pratique et esthétique. Cependant, elle est encore loin de l'état idéal, donc tout le monde doit fournir des commentaires en temps opportun sur les problèmes et contribuer au code.

Process

Vux est une bibliothèque d'interface utilisateur pour Vue.js Le site officiel est ici Le guide de configuration du document officiel se concentre sur. la liste des technologies. Permettez-moi de simplifier le processus de configuration de Vux ici.

1. Installer vux

npm install vux --save

2. Installer moins. -loader

vux utilise less pour compiler le code source, le projet doit donc avoir less-loader.

npm install less less-loader --save-dev

3. Installez vux-loader et configurez vuxLoader :

Installez vux-loader :

npm install less vux-loader --save-dev

Vous n'avez pas besoin d'installer ou de configurer vux-loader. Si vous ne le configurez pas, importez le composant comme ceci :

import AlertPlugin from 'vux/src/plugins/Alert'
import ToastPlugin from 'vux/src/plugins/Toast'

Après la configuration, vous pouvez importer le composant comme ceci :

import { AlertPlugin, ToastPlugin } from 'vux'

Le processus de configuration est le suivant :

Modifiez comme suit dans webpack.base.config.js, où webpackConfig est votre configuration précédente (c'est-à-dire celle sur le côté droit du module .export auparavant, maintenant enregistré sous cette variable) :

const vuxLoader = require('vux-loader')
module.exports = vuxLoader.merge(webpackConfig, {
  options: {
    showVuxVersionInfo: false //关闭vux在console里输出的版本信息
  },
  plugins: [{
    name: 'vux-ui'
  }]
})

J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles associés :

Comment implémenter une version web de la calculatrice en JS

Comment utiliser JS pour implémenter la trajectoire parabolique d'une petite boule

Comment implémenter la traversée d'un arbre binaire à l'aide de JavaScript

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!