Informationen zum Vue-Konfigurationshandbuch (ausführliches Tutorial)

Vux ist eine UI-Bibliothek von Vue.js. Der Konfigurationsleitfaden des offiziellen Dokuments konzentriert sich hier auf die Liste der Technologien. Interessierte Freunde, folgen Sie bitte dem Herausgeber von Script House, um gemeinsam zu lernen

Einführung

Vux (Aussprache [v'ju:z], das wie Ansichten) ist eine mobile UI-Komponentenbibliothek, die auf Basis von WeUI und Vue (2.x) entwickelt wurde und hauptsächlich WeChat-Seiten bedient.

Basierend auf Webpack+vue-loader+vux können Sie schnell mobile Seiten entwickeln. Mit vux-loader können Sie die benötigten Stile basierend auf WeUI anpassen.

vux-loader stellt sicher, dass Komponenten bei Bedarf verwendet werden, sodass Sie sich nicht darum kümmern müssen, irgendwann den gesamten Code der Vux-Komponentenbibliothek zu packen.

vux ist nicht vollständig von WeUI abhängig, aber versuchen Sie, den gesamten UI-Stil nahe an den Designspezifikationen von WeUI zu halten. Das ursprüngliche Ziel bestand darin, eine benutzerfreundliche, praktische und schöne mobile UI-Komponentenbibliothek zu erstellen. Allerdings ist sie noch weit vom Idealzustand entfernt, sodass jeder zeitnah Feedback zu Problemen geben und Code beisteuern muss.

Prozess

Vux ist eine UI-Bibliothek für Vue.js. Der Schwerpunkt liegt auf der offiziellen Website die Liste der Technologien. Lassen Sie mich den Vux-Konfigurationsprozess hier vereinfachen.

1. Vux installieren

npm install vux --save

2 -loader

vux verwendet weniger zum Kompilieren des Quellcodes, daher muss das Projekt über einen Less-Loader verfügen.

npm install less less-loader --save-dev

3. Vux-Loader installieren und vuxLoader konfigurieren:

Vux-Loader installieren:

npm install less vux-loader --save-dev

Sie können' t Bei der Installation wird vux-loader nicht konfiguriert. Die Komponente wird wie folgt eingeführt:

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

Nach der Konfiguration kann die Komponente wie folgt eingeführt werden:

import { AlertPlugin, ToastPlugin } from 'vux'

Der Konfigurationsprozess ist wie folgt folgt:

in Ändern Sie webpack.base.config.js wie folgt, wobei webpackConfig Ihre vorherige Konfiguration ist (d. h. die auf der rechten Seite von module.export zuvor, jetzt als diese Variable gespeichert):

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

Das Obige habe ich zusammengestellt. Ich hoffe, es wird in Zukunft für alle hilfreich sein.

Verwandte Artikel:

So implementieren Sie die Webversion des Rechners in JS

Wie Sie JS verwenden, um die parabolische Flugbahn zu implementieren einer kleinen Kugel

So implementieren Sie die Binärbaumdurchquerung mit JavaScript

Das obige ist der detaillierte Inhalt vonInformationen zum Vue-Konfigurationshandbuch (ausführliches Tutorial). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!