Vue 구성 가이드 정보(자세한 튜토리얼)

Vux는 Vue.js용 UI 라이브러리입니다. 공식 문서의 구성 가이드는 여기서 Vux 구성 프로세스를 단순화합니다. 관심있는 친구들은 Script House 에디터를 따라 함께 배워보세요

Introduction

Vux([v'ju:z]로 발음, views와 동일)는 WeUI와 Vue(2)를 기반으로 개발된 모바일 단말입니다. .x) 주로 WeChat 페이지를 제공하는 UI 구성 요소 라이브러리입니다.

webpack+vue-loader+vux를 기반으로 vux-loader를 사용하면 WeUI를 기반으로 필요한 스타일을 맞춤 설정할 수 있습니다.

vux-loader는 요청 시 구성 요소가 사용되도록 보장하므로 결국 전체 vux 구성 요소 라이브러리 코드를 패키징하는 것에 대해 걱정할 필요가 없습니다.

vux는 WeUI에 완전히 의존하지는 않지만 전체적인 UI 스타일을 WeUI의 디자인 사양에 가깝게 유지하려고 노력합니다. 원래 목표는 사용하기 쉽고 실용적이며 아름다운 모바일 UI 구성 요소 라이브러리를 만드는 것이었지만, 아직 이상적인 상태와는 거리가 멀기 때문에 모든 사람이 문제에 대해 적시에 피드백을 제공하고 코드에 기여해야 합니다.

Process

Vux는 Vue.js의 UI 라이브러리입니다. 공식 문서의 구성 가이드는 여기서 Vux 구성 프로세스를 단순화합니다.

1. vux 설치

npm install vux --save

2. less-loader 설치

vux는 소스 코드를 컴파일하는 데 less를 사용하므로 프로젝트에 less-loader가 있어야 합니다. .

npm install less less-loader --save-dev

3. vux-loader 설치 및 vuxLoader 구성:

vux-loader 설치:

npm install less vux-loader --save-dev

vux-loader를 구성하지 않으면 다음과 같이 구성 요소가 도입됩니다.

Configuration 그런 다음 다음과 같이 구성 요소를 도입할 수 있습니다.

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

구성 프로세스는 다음과 같습니다.

webpack.base.config.js에서 다음과 같이 수정합니다. 여기서 webpackConfig는 이전 구성(즉, 이전에는 module.export 오른쪽, 지금은 이 변수로 저장하세요):

import { AlertPlugin, ToastPlugin } from 'vux'

위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되길 바랍니다.

관련 기사:

JS에서 웹 버전 계산기를 구현하는 방법

JS를 사용하여 공의 포물선 궤적 이동을 구현하는 방법

JavaScript를 사용하여 이진 트리 탐색을 구현하는 방법

위 내용은 Vue 구성 가이드 정보(자세한 튜토리얼)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!