Browse Source

feat: 引入unocss

cuiyalong 1 year ago
parent
commit
a3f9ba98bd

+ 1 - 0
apps/mobile/package.json

@@ -46,6 +46,7 @@
     "rollup-plugin-visualizer": "^5.9.2",
     "sass": "^1.63.2",
     "terser": "^5.14.2",
+    "unocss": "^0.58.5",
     "unplugin-vue-components": "^0.25.1",
     "vite": "^4.3.9",
     "vite-plugin-compression": "^0.5.1",

+ 1 - 0
apps/mobile/postcss.config.js

@@ -15,6 +15,7 @@ if (!envBook) {
       viewportUnit: 'vw',
       fontViewportUnit: 'vw',
       selectorBlackList: [],
+      // 小于或等于 1px 的像素值不进行转换
       minPixelValue: 1,
       mediaQuery: false,
       // 兼容 vant 需要去掉此处

+ 2 - 0
apps/mobile/src/main.js

@@ -3,6 +3,8 @@ import Vue from 'vue'
 import App from './App.vue'
 import router from './router'
 import store from './store'
+// https://unocss.dev
+import 'virtual:uno.css'
 import 'vant/lib/index.less'
 import '@/assets/style/index.scss'
 

+ 12 - 0
apps/mobile/uno.config.js

@@ -0,0 +1,12 @@
+import { defineConfig, presetUno, presetAttributify } from 'unocss'
+import transformerVariantGroup from '@unocss/transformer-variant-group'
+import transformerDirectives from '@unocss/transformer-directives'
+
+// unocss样式调试器:https://unocss.dev/tools/inspector
+// 访问 http://127.0.0.1:8080/__unocss
+
+export default defineConfig({
+  // ...UnoCSS options
+  presets: [presetUno(), presetAttributify()],
+  transformers: [transformerVariantGroup(), transformerDirectives()]
+})

+ 5 - 3
apps/mobile/vite.config.js

@@ -1,5 +1,6 @@
 import { resolve } from 'path'
 
+import UnoCSS from 'unocss/vite'
 import viteCompression from 'vite-plugin-compression'
 import { defineConfig, splitVendorChunkPlugin } from 'vite'
 import legacy from '@vitejs/plugin-legacy'
@@ -53,6 +54,7 @@ export default defineConfig(({ command }) => {
     plugins: [
       splitVendorChunkPlugin(),
       vue2(),
+      UnoCSS(),
       ViteEjsPlugin({
         assets: {
           version: Date.now()
@@ -91,7 +93,7 @@ export default defineConfig(({ command }) => {
         },
         less: {
           modifyVars: {
-            hack: `true; @import "@/assets/style/vant.theme.less";`
+            hack: 'true; @import "@/assets/style/vant.theme.less";'
           },
           javascriptEnabled: true
         }
@@ -102,12 +104,12 @@ export default defineConfig(({ command }) => {
       port: 8080,
       proxy: {
         '/jyapi': {
-          target: 'https://jybx3-webtest.jydev.jianyu360.com',
+          target: 'https://app5-jytest.jydev.jianyu360.com',
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/jyapi/, '')
         },
         '/api': {
-          target: 'https://jybx3-webtest.jydev.jianyu360.com',
+          target: 'https://app5-jytest.jydev.jianyu360.com',
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/api/, '')
         },