依赖 和 提交按钮样式优化

babel.config.js

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

package.json

@@ -10,36 +10,33 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "axios": "^0.26.0",
+    "axios": "^0.27.2",
     "clipboard": "^2.0.11",
-    "core-js": "^3.8.3",
+    "core-js": "^3.26.1",
     "crypto-js": "^4.1.1",
     "escape-html": "^1.0.3",
     "file-saver": "^2.0.5",
-    "pako": "^2.0.4",
+    "pako": "^2.1.0",
-    "qrcode": "^1.5.0",
+    "qrcode": "^1.5.1",
-    "view-design": "^4.0.0",
+    "view-design": "^4.7.0",
-    "vue": "^2.7.7",
+    "vue": "^2.7.14",
-    "vue-axios": "^3.4.1",
+    "vue-axios": "^3.5.2",
-    "vue-i18n": "^8.27.2",
+    "vue-i18n": "^8.28.2",
-    "vue-router": "^3.5.1"
+    "vue-router": "^3.5.4"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",
     "@babel/eslint-parser": "^7.12.16",
-    "@vue/cli-plugin-babel": "~5.0.0",
+    "@vue/cli-plugin-babel": "~5.0.8",
-    "@vue/cli-plugin-eslint": "~5.0.0",
+    "@vue/cli-plugin-eslint": "~5.0.8",
-    "@vue/cli-plugin-router": "~5.0.0",
+    "@vue/cli-plugin-router": "~5.0.8",
-    "@vue/cli-service": "~5.0.0",
+    "@vue/cli-service": "~5.0.8",
     "compression-webpack-plugin": "^10.0.0",
     "eslint": "^7.32.0",
     "eslint-plugin-vue": "^8.0.3",
     "javascript-obfuscator": "^4.0.0",
-    "vue-cli-plugin-iview": "^2.0.0",
+    "webpack-obfuscator": "^3.5.1",
-    "vue-template-compiler": "^2.6.14",
+    "webpack": "^5.1.0"
-    "webpack-bundle-analyzer": "^4.7.0",
-    "webpack-cli": "^5.0.0",
-    "webpack-obfuscator": "^3.5.1"
   },
   "eslintConfig": {
     "root": true,

src/App.vue

@@ -13,6 +13,7 @@ export default {
 </script>
 
 <style>
+
 .ivu-btn:focus {
   box-shadow: none !important;
 }
@@ -26,6 +27,7 @@ export default {
 }
 
 body {
+  -webkit-text-size-adjust: 100% !important;
   font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial,
     "PingFang SC", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei",
     sans-serif;
@@ -92,7 +94,7 @@ body {
 .noteUrl {
   color: #ed4014;
   font-weight: bold;
-  font-family: Merriweather;
+  font-family: Merriweather "Bitstream Vera Sans Mono", Consolas, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei";
 
 }
 
@@ -110,4 +112,10 @@ body {
 .hideBlock {
   display: none;
 }
+
+button span {
+  font-size: 16px !important;
+  font-family: apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
+  margin-bottom: 5px;
+}
 </style>

src/i18n/config/en.js

@@ -12,6 +12,7 @@ const en = {
     selectAll: "Select All",
     copy: "Copy",
     copyAll: "Copy All",
+    share: "Share"
   },
 };
 export default en;

src/i18n/config/zh.js

@@ -12,6 +12,7 @@ const zh = {
     selectAll: "全选",
     copy: "复制",
     copyAll: "复制全部",
+    share: "分享"
   },
 };
 export default zh;

src/views/EditNote.vue

@@ -39,6 +39,8 @@
   justify-content: center;
 }
 
+
+
 @media print {
 
   @page {
@@ -62,14 +64,6 @@
 }
 </style>
 
-<style>
-/* .ivu-btn-text:focus {
-  margin-top: -3px;
-  box-shadow: none !important;
-} */
-</style>
-
-
 <template>
   <div class="layout">
 
@@ -106,8 +100,8 @@
 
                 <Button-group size="large">
                   <Button aria-label="publish" type="error" :loading="model.submitting"
-                    style="margin-left:5px; border-radius: 0px;font-size: 24px;" @click="submitNote()"
+                    style="margin-left:5px; border-radius: 0px;font-size: 23px;" @click="submitNote()"
-                    icon="md-cloud-upload"></Button>
+                    icon="md-cloud-upload">{{$t("button.share")}}</Button>
                   <Button aria-label="menu" type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"
                     @click="switchMenu()" @blur.native="hideMenu()" icon="md-menu"></Button>
 

src/views/ViewNote.vue

@@ -128,11 +128,7 @@
   border-radius: 0px !important;
 }
 
-button span {
+
-  font-size: 18px;
-  margin-left: -1px !important;
-  margin-bottom: 4px;
-}
 
 /* #noteMenu button span{
   font-size: 15px;
@@ -172,7 +168,7 @@ button span {
                 <Button-group size="large">
 
                   <Button aria-label="share" type="error"
-                    style="margin-left:5px; border-radius: 0px;font-size: 24px; font-family: Arial, sans-serif"
+                    style="margin-left:5px; border-radius: 0px;font-size: 23px; font-family: Arial, sans-serif"
                     @click="showShareModel()" icon="md-cloud-done">{{ state.ttlDesc }}</Button>
 
                   <Button aria-label="menu" type="error" style="margin-left:5px; border-radius: 0px;font-size: 24px;"

vue.config.js

@@ -1,42 +1,47 @@
 const { defineConfig } = require("@vue/cli-service");
 const CompressionPlugin = require("compression-webpack-plugin");
 const WebpackObfuscator = require('webpack-obfuscator');
+const TerserPlugin = require("terser-webpack-plugin");
 
 module.exports = defineConfig({
+
   assetsDir: 'static',
   productionSourceMap: false,
-  configureWebpack: {
+  configureWebpack: (config) => {
 
-    //    devtool: false,
+    // 为生产环境修改配置
-    plugins: [
+    //if (process.env.NODE_ENV === 'production') {
-      new WebpackObfuscator({
+    if (true) {
-        compact: true,//压缩代码
+      config.plugins.push(
-        controlFlowFlattening: true,//是否启用控制流扁平化(降低1.5倍的运行速度)
+        new WebpackObfuscator({
-        controlFlowFlatteningThreshold: 1,//应用概率;在较大的代码库中，建议降低此值，因为大量的控制流转换可能会增加代码的大小并降低代码的速度。
+          compact: true,//压缩代码
-        deadCodeInjection: true,//随机的死代码块(增加了混淆代码的大小)
+          controlFlowFlattening: true,//是否启用控制流扁平化(降低1.5倍的运行速度)
-        deadCodeInjectionThreshold: 1,//死代码块的影响概率
+          controlFlowFlatteningThreshold: 1,//应用概率;在较大的代码库中，建议降低此值，因为大量的控制流转换可能会增加代码的大小并降低代码的速度。
-        debugProtection: true,//此选项几乎不可能使用开发者工具的控制台选项卡
+          deadCodeInjection: true,//随机的死代码块(增加了混淆代码的大小)
-        disableConsoleOutput: true,//通过用空函数替换它们来禁用console.log，console.info，console.error和console.warn。这使得调试器的使用更加困难。
+          deadCodeInjectionThreshold: 1,//死代码块的影响概率
-        identifierNamesGenerator: 'hexadecimal',//标识符的混淆方式 hexadecimal(十六进制) mangled(短标识符)
+          debugProtection: true,//此选项几乎不可能使用开发者工具的控制台选项卡
-        log: false,
+          disableConsoleOutput: true,//通过用空函数替换它们来禁用console.log，console.info，console.error和console.warn。这使得调试器的使用更加困难。
-        renameGlobals: false,//是否启用全局变量和函数名称的混淆
+          identifierNamesGenerator: 'hexadecimal',//标识符的混淆方式 hexadecimal(十六进制) mangled(短标识符)
-        rotateStringArray: true,//通过固定和随机（在代码混淆时生成）的位置移动数组。这使得将删除的字符串的顺序与其原始位置相匹配变得更加困难。如果原始源代码不小，建议使用此选项，因为辅助函数可以引起注意。
+          log: false,
-        selfDefending: true,//混淆后的代码,不能使用代码美化,同时需要配置 cpmpat:true;
+          renameGlobals: false,//是否启用全局变量和函数名称的混淆
-        stringArray: true,//删除字符串文字并将它们放在一个特殊的数组中
+          rotateStringArray: true,//通过固定和随机（在代码混淆时生成）的位置移动数组。这使得将删除的字符串的顺序与其原始位置相匹配变得更加困难。如果原始源代码不小，建议使用此选项，因为辅助函数可以引起注意。
-        stringArrayThreshold: 1,
+          selfDefending: true,//混淆后的代码,不能使用代码美化,同时需要配置 cpmpat:true;
-        transformObjectKeys: true,
+          stringArray: true,//删除字符串文字并将它们放在一个特殊的数组中
-        unicodeEscapeSequence: false//允许启用/禁用字符串转换为unicode转义序列。Unicode转义序列大大增加了代码大小，并且可以轻松地将字符串恢复为原始视图。建议仅对小型源代码启用此选项。
+          stringArrayThreshold: 1,
-      }, ['static/js/chunk-vendors.*.js']),
+          transformObjectKeys: true,
+          unicodeEscapeSequence: false//允许启用/禁用字符串转换为unicode转义序列。Unicode转义序列大大增加了代码大小，并且可以轻松地将字符串恢复为原始视图。建议仅对小型源代码启用此选项。
+        }, ['static/js/chunk-vendors.*.js']),
 
-      new CompressionPlugin({
+        new CompressionPlugin({
-        algorithm: "gzip", // 使用gzip压缩
+          algorithm: "gzip", // 使用gzip压缩
-        test: /\.js$|\.html$|\.png$|\.jpg$|\.svg$|\.css$/, // 匹配文件名
+          test: /\.js$|\.html$|\.png$|\.jpg$|\.svg$|\.css$/, // 匹配文件名
-        filename: "[path][base].gz[query]", // 压缩后的文件名(保持原文件名，后缀加.gz)
+          filename: "[path][base].gz[query]", // 压缩后的文件名(保持原文件名，后缀加.gz)
-        minRatio: 1, // 压缩率小于1才会压缩
+          minRatio: 1, // 压缩率小于1才会压缩
-        threshold: 5120, // 对超过10k的数据压缩
+          threshold: 5120, // 对超过10k的数据压缩
-        deleteOriginalAssets: false, // 是否删除未压缩的源文件，谨慎设置，如果希望提供非gzip的资源，可不设置或者设置为false（比如删除打包后的gz后还可以加载到原始资源文件）
+          deleteOriginalAssets: false, // 是否删除未压缩的源文件，谨慎设置，如果希望提供非gzip的资源，可不设置或者设置为false（比如删除打包后的gz后还可以加载到原始资源文件）
-      }),
+        }),
-    ],
+      )
+    }
   },
   transpileDependencies: true,
   chainWebpack: (config) => {