介绍 npm install vue-cli -g //,如果还没安装,vuw-cli
vue init airyland/vux2 projectName//注意,如果项目代码没有特别的规范要求,不要启用代码检查,否则会产生很多莫名其妙的报的错//Use ESLint 用lint your 代码?,(Y/n),选择n
,
cd projectName
npm install ——注册表=https://registry.npm.taobao.org
npm run 开发//注意:直接使用cnpm可能会导致依赖不正确。强烈建议给npm设置淘宝的注册表。 import Vue 得到& # 39;vue # 39;
import FastClick 得到& # 39;fastclick& # 39;
import VueRouter 得到& # 39;vue-router& # 39;
import App 得到& # 39;。/应用# 39;
import router 从# 39;。/路由器/memberRouter.js& # 39;,,,//- - - - - - - - - - - -自定义的路由文件
import Base 得到& # 39;。/资产/js/baseFun.js& # 39;,,,,,//- - - - - - - - - - - -自定义的公共函数和公共请求方法
import stores 得到& # 39;。/存储/商店# 39;,,,,,,,,//- - - - - - - - - - - -自定义的全局变量
import & # 39;。/资产/css/base.css& # 39;,,,,,,,,,,//- - - - - - - - - - - -引入的全局公共css
FastClick.attach (document.body)
Vue.config.productionTip =false//注册全局函数和全局常量
Vue.prototype.baseFun=Base.baseFun;,//- - - - - -注册到vue的全局,方便各个组件和页面js调用公共函数
Vue.prototype.baseAjax=Base.baseAjax;//- - - - - -将封装的ajax请求函数注册到vue的全局,
Vue.use (VueRouter)
Vue ({var globalVm=new
路由器才能,,,,,,,//- - - - -路由器文件
el才能:& # 39;#应用# 39;
商店才能:商店,,,,,,//- - - - - -全局变量
,,模板:& # 39;& lt; App/祝辞& # 39;
,,组件:{},App
})
这篇文章主要介绍Vue2.0 + Vux怎么搭建一个完整的移动webApp项目,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
<强> 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项目的搭建脚手架
2,运行模板文件
打开本8080年地端口可以看到模板运行如下
注意:,如包安装没有报的错,npm运行dev报错,很可能是8080端口冲突
3.2创建项目文件
项目目录如下
我们只需要将我们的文件放置在src目录下
路由器文件做路由配置文件,
组件放页面相关的。vue和js文件,放
资产项目的图片,css,公共自定义js等
3.3代码说明
主要。js文件引入
其他页面上的代码逻辑等请直接参考源码
3.4其他说明
本项目的请求数据全部为本地的json文件,放在静态/basicData里
以上是“Vue2.0 + Vux怎么搭建一个完整的移动webApp项目”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注行业资讯频道!
