Maison > interface Web > js tutoriel > le corps du texte

Comment ajouter vux dans vue ?

亚连
Libérer: 2018-06-23 14:58:16
original
9482 Les gens l'ont consulté

Ajoutez vux via la commande npm install vux --save, configurez les informations dans le fichier de configuration approprié et pour les méthodes d'ajout de code spécifiques, veuillez vous référer à cet article

Introduction

Vux (prononcé [v'ju:z], identique à vues) est une bibliothèque de composants d'interface utilisateur mobile développée sur la base de WeUI et Vue (2.x), servant 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.

1. Commande pour ajouter vux

npm install vux --save
Copier après la connexion

2. Configurer dans build/webpack.base.conf.js

const vuxLoader = require('vux-loader')
const webpackConfig = originalConfig // 原来的 module.exports 代码赋值给变量 webpackConfig
//即将原来的module.exports 改为 const webpackConfig
module.exports = vuxLoader.merge(webpackConfig, {
plugins: [{
  name: 'vux-ui'
 }]
})
Copier après la connexion

3. Ajouter moins

npm install less less-loader --save-dev
Copier après la connexion

4. Ajouter yaml-loader

npm install yaml-loader --save-dev
Copier après la connexion

5. Ajoutez vux-loader

npm install vux-loader --save-dev
Copier après la connexion

6. Ajoutez

const FastClick = require('fastclick')
FastClick.attach(document.body)
import VueRouter from 'vue-router'
Vue.use(VueRouter)
Copier après la connexion

à main.js, ce qui précède est ce que j'ai compilé pour tout le monde, j'espère. cela sera utile à l’avenir.

Articles connexes :

Comment utiliser l'outil de vérification du numéro de téléphone mobile PhoneUtils en javaScript

Fonctions associées dans l'applet WeChat Résumé ( tutoriel détaillé)

Comment implémenter la barre de progression de téléchargement dans le mini programme WeChat

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!

Étiquettes associées:
vue
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal