1.描述

应用技术：Vue2.0、Vux、vux-loader、vue-cli、vue-router、vuex

2.翻译

3.实现进程

3.1构建框架(需要安装node.js和npm)

1.快速构建项目模板

由于项目使用vux，建议使用vux官网的airyland/vux2模板，vue-cli工具是vue项目的脚手架。

Npm install vue-cli -g //如果还没有安装vuw-CLI vue init airyland/vux2项目名称//注意，如果项目代码没有特殊的规范要求，不要启用代码检查，否则会报告很多莫名其妙的错误//使用ESLint lint你的代码？(Y/n)选择n CD项目名称NPM install-registry=https://registry.npm.taobao.org NPM run dev//注意：直接使用cnpm可能会导致不正确的依赖关系。强烈建议为npm设置淘宝注册表。2.运行模板文件

打开本地8080端口，您可以看到模板运行如下

注意：如果程序包安装没有报告错误，npm run dev会报告一个错误，这可能是8080端口冲突

3.2创建项目文件

项目目录如下

我们只需要把文件放在src目录下

路由器文件用作路由配置文件，

组件放入。与页面相关的vue和js文件，

资产放图片，css，公共自定义js等。项目的

3.3代码描述

main.js文件介绍

从“vue”导入Vue从“FastClick”导入fastclick从“vue-router”导入VueRouter从“导入App”。/App“从导入路由器”。/router/MemberRouter . js '///-自定义路由文件导入基础自'。/assets/js/base fun . js '///-自定义公共函数和公共请求方法从存储导入。/store/store '///-用户定义的全局变量导入'。/assets/CSS/base . CSS '///-引入了全局公共CSS fastclick . attach(document . body)vue . config . production tip=false//注册全局函数和全局常量vue . prototype .///////-将封装的ajax请求函数注册到vue的全局vue . use(vue router)var global VM=new vue({ router，///-router file El : ' # app '，store: stories，//-全局变量template:' app/'，components

3.4其他说明

这个项目所请求的数据都是本地json文件，这些文件放在静态/基本数据中

4源代码路径

Github地址：如果https://github.com/xingxiaoyiyio/vue2-vux-fitness-project感觉不错，请记得给一颗星_

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。