{"id":41253329,"url":"https://github.com/xusenlin/vue-multiple-pages","last_synced_at":"2026-01-23T01:44:06.777Z","repository":{"id":39554394,"uuid":"153780685","full_name":"xusenlin/vue-multiple-pages","owner":"xusenlin","description":":four_leaf_clover: 一个移动端多页面脚手架，使用vueCli v5.0.8 + Vue(\u003cscript setup\u003e) v3.2 + vant v4.0+px2vw适配","archived":false,"fork":false,"pushed_at":"2023-04-18T07:18:31.000Z","size":815,"stargazers_count":110,"open_issues_count":3,"forks_count":44,"subscribers_count":7,"default_branch":"master","last_synced_at":"2023-11-07T19:03:53.505Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xusenlin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-10-19T12:38:53.000Z","updated_at":"2023-10-16T10:29:58.000Z","dependencies_parsed_at":"2023-02-08T08:46:06.947Z","dependency_job_id":null,"html_url":"https://github.com/xusenlin/vue-multiple-pages","commit_stats":null,"previous_names":[],"tags_count":4,"template":null,"template_full_name":null,"purl":"pkg:github/xusenlin/vue-multiple-pages","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xusenlin%2Fvue-multiple-pages","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xusenlin%2Fvue-multiple-pages/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xusenlin%2Fvue-multiple-pages/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xusenlin%2Fvue-multiple-pages/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xusenlin","download_url":"https://codeload.github.com/xusenlin/vue-multiple-pages/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xusenlin%2Fvue-multiple-pages/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28677711,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-23T01:00:35.747Z","status":"ssl_error","status_checked_at":"2026-01-23T01:00:19.529Z","response_time":144,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2026-01-23T01:44:06.304Z","updated_at":"2026-01-23T01:44:06.773Z","avatar_url":"https://github.com/xusenlin.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# vueMultiplePages\n\n## 一个 Vue 多页面应用,适用于移动端不需要单页应用（SPA）的场景\n\n\n```\nyarn build:dev  //打包开发环境\nyarn build:pre //打包测试环境\nyarn build // 打包正式环境\n```\n\n\u003e 番外： [MareWood](https://github.com/xusenlin/MareWood) 是一个 Go 开发的轻量级前端部署工具,可以很灵活的配置各种打包部署环境并提供访问,特别是远程的时候，方便后端和测试使用,草鸡好用。\n\n本人做了很多H5相关的项目，如 M站、微信活动页面、原生App内嵌H5页面（jsBridge交互），从实践过程中，真的不建议大家在这部分做单页应用（SPA），首先微信里面的H5页面\n在安卓和ios的url机制不一样，因此会导致两边的微信签名需要针对不同平台处理，当项目越来越大的时候，从其他应用跳转到这个应用的时候，即使你只使用其中一个页面，但是可能需要你去处理路由\n和权限，页面的复用性没有多页面的好。使用多页面的话每个页面之间没有多余的联系，我可以配置好每个页面的标题，每个页面的url必须携带的参数等，页面之间的跳转可以直接\n`window.location.href = `也可以通过 jsBridge(在原生app的环境)去跳转。\n\n# 更新日志\n\n### 第三次重构（2022.08）最新vueCli v5.0.8  + Vue(\u003cscript setup\u003e) v3.2 + vant v4.0\n\n在后台重构的时候我选择了vite,虽然vite现阶段带来了很棒的开发体验，但是它的多页面配置在开发阶段和打包上线阶段的不一致会\n导致页面跳转得不完美，即使目前有很多插件去支持多页面，但是都不是很完美，因此我选择继续使用vuecli,如果有一天vite有了更好的解决方式，\n我会第一时间重构到 vite + ts。\n\n- 添加了 axios 请求库，并做了简单的拦截。\n- 添加了漂亮的移动端调试工具 eruda,方便在手机上调试（使用 npm run build 命令不会出现此工具）。\n- 修改了 Url 参数验证和初始化，`window.$pageParams` 保存了 Url 携带的参数对象。`let { id } = window.$pageParams;`\n- `window.$pageName` 表示当前页面的名字，如 demo 目录生成 demo.html，window.$pageName 就是 demo\n- 支持pages目录无限嵌套，只要一个目录里面包含`main.js`和`App.js`,就会认为当前目录是一个html页面。因此可以合理的通过目录来分类你的html页面。\n- 封装了微信 jsSdk 的常用签名分享等一堆堆常用的东西，食用前请先安装 weixin-js-sdk并引入。\n- 将postcss-px2rem重构为postcss-px-to-viewpor自动将px单位转换vw，更好的适配方案，目前为了和大部分 ui 库兼容，设置的设计稿宽度为 375，可自行修改。\n- 没有路由（vue-route）,页面跳转请使用`window.location.href = \"./demo.html\" + obj2StrParams(params);`\n- 所有的页面默认使用public/index.html作为模板，除非你在页面目录下添加index.html。\n- 每次添加页面目录需要重新运行 npm run dev\n\n\n### 第二次重构(2020.01) 全新依赖和ESLint+Prettier重构 v0.0.1\n此版本的说明请切换分支版本查看\n\n\n### 其他\n\n我们还需要 fastclick js 去解决移动端点击 300ms 延迟吗？\n从 Chrome 32（早在 2014 年）开始，这种针对移动设备优化的网站的延迟就消失了，\n而无需消除缩放问题！Firefox 和 IE / Edge 之后不久也做了同样的事情，并在 2016 年 3 月在 iOS 9.3 中进行了类似的修复。\n只要您 head 包括：\n\n```html\n\u003cmeta name=\"viewport\" content=\"width=device-width\" /\u003e\n```\n\n浏览器就会以这种方式假定您已使文本在移动设备上可读，因此无需fastclick。\n\n---\n\n还有各种移动端奇形怪状的问题解决方案\nhttps://juejin.im/post/5d6e1899e51d453b1e478b29\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxusenlin%2Fvue-multiple-pages","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxusenlin%2Fvue-multiple-pages","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxusenlin%2Fvue-multiple-pages/lists"}