Home  >  Article  >  Web Front-end  >  Detailed explanation of the installation and configuration steps for using Vux in Vue projects

Detailed explanation of the installation and configuration steps for using Vux in Vue projects

php中世界最好的语言
php中世界最好的语言Original
2018-05-14 14:22:095170browse

This time I will bring you a detailed explanation of the configuration steps for using Vux in the Vue projectInstallation, what are the notes for using Vux installation and configuration in the Vue project, the following is a practical case, one Get up and take a look.

The vue environment is installed by default

1. Install vux

##npm install vux --save-dev

2. Install vux-loader

npm install vux-loader --save-dev //官网没提安装这个,但是不安装会报错

3. Install less-loader to correctly compile less source code

npm install less less-loader --save-dev

4 .Install yaml-loader to correctly read language files

npm install yaml-loader --save-dev

5.Modify the code in build/webpack.base.conf.js

in the original text is changed to the following

#6. After installing the dependencies and configuration file Later, introduce the vux template and modify the previous about.vue. The entire code is as follows

<template>
 <p class="about">
 <a href="./index.html" rel="external nofollow" >从about跳转到demo1</a>
 <group>
  <cell title="title" value="value"></cell>
 </group>
 </p>
</template>
<script>
 import { Group, Cell } from 'vux'
 export default {
 components: {
  Group,
  Cell
 }
 }
</script>
<style>
</style>
Finally, when running npm run dev, the about.vue displayed is like this, which means it has been The introduction of vux is successful, and then you can use vux components to develop quickly

I believe you have mastered the method after reading the case in this article. For more exciting things, please pay attention to other php Chinese websites related articles!

Recommended reading:

Nodejs log module winston usage summary

##vue vue-router vuex operation permissions

The above is the detailed content of Detailed explanation of the installation and configuration steps for using Vux in Vue projects. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn