Преглед на файлове

feat: add postcss, postcss-pxtorem ame-flexible

xutongzee преди 1 година
родител
ревизия
d0b7cf0119
променени са 8 файла, в които са добавени 735 реда и са изтрити 71 реда
  1. 690 46
      package-lock.json
  2. 4 0
      package.json
  3. 12 0
      postcss.config.js
  4. 1 1
      public/index.html
  5. 2 0
      src/main.js
  6. 5 0
      src/styles/index.less
  7. 1 1
      src/views/Home.vue
  8. 20 23
      vue.config.js

Файловите разлики са ограничени, защото са твърде много
+ 690 - 46
package-lock.json


+ 4 - 0
package.json

@@ -8,6 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "amfe-flexible": "^2.2.1",
     "axios": "^1.6.0",
     "core-js": "^3.6.5",
     "dingtalk-jsapi": "^2.13.71",
@@ -29,6 +30,9 @@
     "eslint-plugin-vue": "^6.2.2",
     "less": "^4.2.0",
     "less-loader": "^7.3.0",
+    "postcss": "^8.4.31",
+    "postcss-loader": "^4.3.0",
+    "postcss-pxtorem": "^5.1.1",
     "vue-template-compiler": "^2.6.11"
   },
   "eslintConfig": {

+ 12 - 0
postcss.config.js

@@ -0,0 +1,12 @@
+module.exports = {
+    plugins: {
+        "postcss-pxtorem": {
+            rootValue: 37.5,
+            propList: ["*"],
+            exclude: ['node_modules'],
+            unitPrecision: 5, //保留rem小数点多少位
+            mediaQuery: false, //媒体查询( @media screen 之类的)中不生效
+            minPixelValue: 12, //px小于12的不会被转换
+        }
+    }
+}

+ 1 - 1
public/index.html

@@ -3,7 +3,7 @@
   <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">
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title>Vue</title>
   </head>

+ 2 - 0
src/main.js

@@ -8,6 +8,8 @@ import '@/styles/index.less'
 import '@/utils/import-vant'
 import App from './App.vue'
 
+import 'amfe-flexible'
+
 Vue.config.productionTip = false
 
 new Vue({

+ 5 - 0
src/styles/index.less

@@ -1 +1,6 @@
 @import url(./variables.less);
+
+// reset base.
+body {
+
+}

+ 1 - 1
src/views/Home.vue

@@ -142,6 +142,6 @@ export default {
     padding: 16px 16px 160px;
   }
   .box {
-    font-size: 20px;
+    font-size: 37.5px;
   }
 </style>

+ 20 - 23
vue.config.js

@@ -1,33 +1,30 @@
 'use strict'
 
-const { log } = require('console')
 const path = require('path')
+
 module.exports = {
-    configureWebpack: {     
-      resolve: {
-        alias: {
-          '@': path.resolve('src'),
-          '@api': path.resolve('src/api')
-        }
-      },   
-        devServer: {
-          headers: {
-            'Access-Control-Allow-Origin': '*'
-          }
-        }
+  configureWebpack: {
+    resolve: {
+      alias: {
+        '@': path.resolve('src'),
+        '@api': path.resolve('src/api')
+      }
     },
-    css: {
-      sourceMap: process.env.NODE_ENV === 'development',
-      requireModuleExtension: true,
-      loaderOptions: {
-        less: {
-          lessOptions: {
+    devServer: {
+      headers: {
+        'Access-Control-Allow-Origin': '*'
+      }
+    }
+  },
+  css: {
+    sourceMap: process.env.NODE_ENV === 'development',
+    requireModuleExtension: true,
+    loaderOptions: {
+      less: {
+        lessOptions: {
 
-          }
         }
       }
-    },
-    chainWebpack: config => {
-      console.log(config);
     }
+  }
 }

Някои файлове не бяха показани, защото твърде много файлове са промени