小程序开发-mpvue构建小程序项目-1步
小程序开发
浏览：871 次
mpvue入口插件介绍
mpvue坑
当MPvue添加新页面或模块时，必须重新npm运行dev来更新它们。它不支持热更新
所有页面模块。mpvue的vue文件需要用main编写。js重复工作
意图
支持小程序热更新
重新定义mpvue小程序页面配置
参考文件：
关键参考文件：
请参阅配置文件：
NPM安装mpvue条目依赖包
npm i mpvue条目--保存
经过漫长的一天操作，mpvue entry的作者为了方便大家，打开了一个基于mpvue entry的模板。您可以直接使用此快速启动来构建项目
Mpvue条目quickStart项目地址：
Mpvue入口快速启动建设项目
$npm安装-g vue cli
$vue init F-loat/mpvue快速启动我的项目
$cd我的项目
$npm安装
$npm运行开发
如何使用mpvue条目快速启动模板
新建页面
在src/pages/目录中添加.vue文件
src/pages。js文件的新页面路径
支持无需重新启动的热更新
参考文件：
//pages.js页
单元导出=[
{
路径：“pages/news/list”，//页面路径也是vue文件相对于src的路径，这是必需的
config:｛//页面配置，即Page.json的内容，可选
NavigationBarTitleText:'文章列表'，
启用下拉刷新：true
}
}
]
使用mpvue条目的注意事项
分包和主承包的配置
主包页必须放在项目默认src/pages/文件夹下
必须将子包参数添加到分包的页面配置中
单元导出=[
//主要包装
{
路径：“pages/cardList/index”，//页面路径也是vue文件相对于src的路径
}, {
路径：'页面/卡片/索引'
},
//分包
{
路径：'packageA/logs'，
subPackage:真，
Config:｛//页面配置，即Page.json的内容
NavigationBarTitleText:'查看启动日志'
}
}
]
小程序默认选项卡栏配置
参考文件：
意图
小程序提供的默认选项卡菜单栏显示在底部
配置法
src/main。将配置添加到js文件
//主Js文件
从“Vue”导入Vue
从“@/App”导入app
从“@/store”导入存储
Vue.config（版本配置）。productionTip=假
app。store=存储
app。mpType=“app”
const app=新Vue（app）
app.$mount（）
导出默认值{
//此字段转到app.json
配置：{
页码：[]，
窗口：{
backgroundTextStyle:'浅'，
navigationBarBackgroundColor:“#fff”，
navigationBarTitleText:'微信'，
navigationBarTextStyle:“黑色”
},
//选项卡栏配置
选项卡栏：{
backgroundColor:“#fafafa”，
borderStyle:“白色”，
selectedColor:“#b4282d”，
颜色：“#666”，
列表：[
{
pagePath：“pages/cardList/index”，
iconPath：“static/images/ic_menu_choice_nor.png”，
selectedIconPath:“static/images/ic_menu_choice_pressed.png”，
text:“卡片列表”
},
{
pagePath：“页面/卡片/索引”，
iconPath：“static/images/ic_menu_choice_nor.png”，
selectedIconPath:“static/images/ic_menu_choice_pressed.png”，
text:“卡”
},
]
}
}
}
BY-Luca_ LJX公司(
