最新版公众号前端

.gitignore

@@ -0,0 +1,28 @@
+.DS_Store
+node_modules
+/dist
+
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
+
+# Cordova
+/vue_app_test/platforms
+/vue_app_test/plugins
+/public/cordova.js

README.md

@@ -0,0 +1,37 @@
+# 九聚-h5挂号-前端
+
+#### 介绍
+九聚-h5挂号-前端
+
+#### 软件架构
+软件架构说明
+
+
+#### 安装教程
+
+1.  xxxx
+2.  xxxx
+3.  xxxx
+
+#### 使用说明
+
+1.  xxxx
+2.  xxxx
+3.  xxxx
+
+#### 参与贡献
+
+1.  Fork 本仓库
+2.  新建 Feat_xxx 分支
+3.  提交代码
+4.  新建 Pull Request
+
+
+#### 特技
+
+1.  使用 Readme\_XXX.md 来支持不同的语言，例如 Readme\_en.md, Readme\_zh.md
+2.  Gitee 官方博客 [blog.gitee.com](https://blog.gitee.com)
+3.  你可以 [https://gitee.com/explore](https://gitee.com/explore) 这个地址来了解 Gitee 上的优秀开源项目
+4.  [GVP](https://gitee.com/gvp) 全称是 Gitee 最有价值开源项目，是综合评定出的优秀开源项目
+5.  Gitee 官方提供的使用手册 [https://gitee.com/help](https://gitee.com/help)
+6.  Gitee 封面人物是一档用来展示 Gitee 会员风采的栏目 [https://gitee.com/gitee-stars/](https://gitee.com/gitee-stars/)

analyze-png.js

@@ -0,0 +1,39 @@
+const fs = require('fs');
+const path = require('path');
+
+// 读取src/assets目录
+const assetsDir = path.join(__dirname, 'src', 'assets');
+
+fs.readdir(assetsDir, (err, files) => {
+  if (err) {
+    console.error('读取目录失败:', err);
+    return;
+  }
+
+  // 过滤出PNG图片
+  const pngFiles = files.filter(file => file.endsWith('.png'));
+
+  // 获取每个文件的大小
+  const fileInfo = pngFiles.map(file => {
+    const filePath = path.join(assetsDir, file);
+    const stats = fs.statSync(filePath);
+    return {
+      name: file,
+      size: stats.size,
+      sizeKB: (stats.size / 1024).toFixed(2)
+    };
+  });
+
+  // 按大小排序（从大到小）
+  fileInfo.sort((a, b) => b.size - a.size);
+
+  // 输出结果
+  console.log('src/assets目录下PNG图片大小分析（从大到小）:');
+  console.log('文件名'.padEnd(25), '大小（字节）'.padEnd(15), '大小（KB）');
+  console.log('-' .repeat(60));
+  fileInfo.forEach(file => {
+    console.log(file.name.padEnd(25), file.size.toString().padEnd(15), file.sizeKB);
+  });
+  console.log('-' .repeat(60));
+  console.log(`总计: ${pngFiles.length} 个PNG图片`);
+});

babel.config.js

@@ -0,0 +1,6 @@
+module.exports = {
+  presets: [
+    '@vue/cli-plugin-babel/preset'
+  ]
+  
+}

optimize-png.js

@@ -0,0 +1,49 @@
+const fs = require('fs');
+const path = require('path');
+const imagemin = require('imagemin');
+const imageminPngquant = require('imagemin-pngquant');
+
+// 源目录和目标目录
+const srcDir = path.join(__dirname, 'src', 'assets');
+const destDir = path.join(__dirname, 'src', 'assets'); // 直接覆盖原文件
+
+// 优化PNG图片的函数
+async function optimizePng() {
+  try {
+    console.log('开始优化PNG图片...');
+    
+    // 读取源目录下的所有PNG图片
+    const files = await imagemin([`${srcDir}/*.png`], {
+      destination: destDir,
+      plugins: [
+        imageminPngquant({
+          quality: [0.6, 0.8] // 质量范围
+        })
+      ]
+    });
+    
+    console.log('PNG图片优化完成！');
+    console.log('优化的文件:');
+    
+    // 计算并显示优化前后的文件大小对比
+    for (const file of files) {
+      const srcPath = path.join(srcDir, path.basename(file.sourcePath));
+      const destPath = file.destinationPath;
+      
+      const srcStats = fs.statSync(srcPath);
+      const destStats = fs.statSync(destPath);
+      
+      const srcSize = srcStats.size;
+      const destSize = destStats.size;
+      const reduction = ((srcSize - destSize) / srcSize * 100).toFixed(2);
+      
+      console.log(`${path.basename(file.sourcePath)}: ${(srcSize / 1024).toFixed(2)}KB → ${(destSize / 1024).toFixed(2)}KB (减少${reduction}%)`);
+    }
+    
+  } catch (error) {
+    console.error('优化PNG图片时出错:', error);
+  }
+}
+
+// 执行优化
+optimizePng();

package.json

@@ -0,0 +1,53 @@
+{
+  "name": "jojubanking",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "serve": "vue-cli-service serve",
+    "build": "vue-cli-service build",
+    "lint": "vue-cli-service lint"
+  },
+  "dependencies": {
+    "@vant/area-data": "^1.1.1",
+    "caniuse-lite": "^1.0.30001546",
+    "canvas": "^2.11.2",
+    "core-js": "^3.45.1",
+    "dommatrix": "^1.0.3",
+    "echarts": "^6.0.0",
+    "pdfh5": "^1.4.7",
+    "pinyin-pro": "^3.27.0",
+    "qs": "^6.14.0",
+    "quill": "^1.3.6",
+    "smoothscroll-polyfill": "^0.4.4",
+    "vant": "^2.12.48",
+    "vconsole": "^3.15.1",
+    "vue": "^2.6.11",
+    "vue-amap": "^0.5.10",
+    "vue-barcode": "^1.3.0",
+    "vue-pdf": "^4.3.0",
+    "vue-qr": "^2.5.0",
+    "vue-resource": "^1.5.1",
+    "vue-router": "^3.2.0",
+    "vue-wechat-title": "^2.0.7",
+    "vuex": "^3.4.0",
+    "web-streams-polyfill": "^3.2.1",
+    "weixin-js-sdk": "^1.6.0",
+    "x2js": "^3.4.1"
+  },
+  "devDependencies": {
+    "@vue/cli-plugin-babel": "~4.4.0",
+    "@vue/cli-plugin-router": "~4.4.0",
+    "@vue/cli-plugin-vuex": "~4.4.0",
+    "@vue/cli-service": "~4.4.0",
+    "axios": "^0.21.1",
+    "compression-webpack-plugin": "^6.1.1",
+    "eslint": "^6.7.2",
+    "image-webpack-loader": "^8.1.0",
+    "lib-flexible": "^0.3.2",
+    "postcss-pxtorem": "^5.1.1",
+    "sass": "^1.26.5",
+    "sass-loader": "^8.0.2",
+    "vue-template-compiler": "^2.6.11",
+    "webpack-bundle-analyzer": "^5.1.0"
+  }
+}

postcss.config.js

@@ -0,0 +1,13 @@
+module.exports = {
+  plugins: {
+    // autoprefixer: {
+    //   browsers: ['Android >= 4.0', 'iOS >= 8'],
+    // },
+    'postcss-pxtorem': {
+      rootValue({ file }) {
+        return file.indexOf('vant') !== -1 ? 37.5 : 75;
+      },
+      propList: ['*'],
+    },
+  },
+};

public/index.html

@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport"
+    content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
+  <meta name="format-detection" content="telephone=yes" />
+  <!-- 开启 safe-area-inset-bottom 属性 -->
+  <van-number-keyboard safe-area-inset-bottom />
+  
+  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
+  <title><%= htmlWebpackPlugin.options.title %></title>
+</head>
+<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
+<body>
+  <noscript>
+    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
+      Please enable it to continue.</strong>
+  </noscript>
+  <div id="app"></div>
+  <!-- built files will be auto injected -->
+</body>
+
+</html>

src/App.vue

@@ -0,0 +1,144 @@
+<template>
+   <div id="app">
+    <!-- 被 keep-alive 缓存的页面 -->
+    <keep-alive>
+      <router-view v-if="$route.meta.keepAlive" />
+    </keep-alive>
+
+    <!-- 普通页面（不缓存） -->
+    <router-view v-if="!$route.meta.keepAlive" />
+  </div>
+  </template>
+
+
+<style lang="scss">
+body{ 
+	padding: 0px;
+	 margin: 0px;
+	 }
+a {
+	text-decoration: none;
+	color: #333;
+	transition: all 0.5s ease 0s;
+}
+
+a:focus {
+	outline: none;
+}
+
+a:hover {
+	text-decoration: none;
+}
+
+ul {
+	list-style-type: none;
+	margin-bottom: 0px;
+}
+
+li {
+	vertical-align: bottom;
+	zoom: 1;
+}
+
+img {
+	border: 0px;
+}
+
+select {
+font-family: "pingfang SC", "Microsoft YaHei", "黑体";
+	color: #666;
+	font-size: 12px;
+}
+
+textarea {
+	font-family: "pingfang SC", "Microsoft YaHei", "黑体";
+	color: #666;
+	font-size: 12px;
+	outline: none;
+}
+
+table {
+	border-collapse: collapse;
+	border-spacing: 0px;
+}
+
+th,
+td {
+	padding: 0;
+}
+
+input {
+	vertical-align: middle;
+	outline: none;
+	font-size: 28px;
+font-family: "pingfang SC", "Microsoft YaHei", "黑体";
+}
+
+.clearfix:before,
+.clearfix:after {
+	content: " ";
+	display: block;
+	height: 0;
+	visibility: hidden;
+	clear: both;
+	overflow: hidden;
+}
+
+.clearfix {
+	zoom: 1;
+}
+
+.clearfix:after {
+	clear: both;
+}
+
+.hidden {
+	display: none;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	font-weight: normal;
+	font-size: inherit;
+	margin: 0px;
+	font-family: "pingfang SC", "Microsoft YaHei", "黑体";
+}
+
+p {
+	margin: 0px;
+font-family: "pingfang SC", "Microsoft YaHei", "黑体";
+}
+
+em,
+i {
+	font-style: normal;
+}
+
+.fl {
+	float: left;
+}
+
+.fr {
+	float: right;
+}
+
+input[type="button"],
+input[type="submit"],
+input[type="reset"] {
+	-webkit-appearance: none;
+}
+#app {
+  margin: 0px auto;
+  font-family: "pingfang SC", "Microsoft YaHei", "黑体";
+  color: #666;
+  font-size: 24px;
+}
+.container{
+	padding: 0px 30px;
+}
+
+</style>