feat: 初始化工程
This commit is contained in:
21
.gitignore
vendored
Normal file
21
.gitignore
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
20
index.html
Normal file
20
index.html
Normal file
@@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
76
package.json
Normal file
76
package.json
Normal file
@@ -0,0 +1,76 @@
|
||||
{
|
||||
"name": "uni-preset-vue",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"dev:custom": "uni -p",
|
||||
"dev:h5": "uni",
|
||||
"dev:h5:ssr": "uni --ssr",
|
||||
"dev:mp-alipay": "uni -p mp-alipay",
|
||||
"dev:mp-baidu": "uni -p mp-baidu",
|
||||
"dev:mp-jd": "uni -p mp-jd",
|
||||
"dev:mp-kuaishou": "uni -p mp-kuaishou",
|
||||
"dev:mp-lark": "uni -p mp-lark",
|
||||
"dev:mp-qq": "uni -p mp-qq",
|
||||
"dev:mp-toutiao": "uni -p mp-toutiao",
|
||||
"dev:mp-harmony": "uni -p mp-harmony",
|
||||
"dev:mp-weixin": "uni -p mp-weixin",
|
||||
"dev:mp-xhs": "uni -p mp-xhs",
|
||||
"dev:quickapp-webview": "uni -p quickapp-webview",
|
||||
"dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
|
||||
"dev:quickapp-webview-union": "uni -p quickapp-webview-union",
|
||||
"build:custom": "uni build -p",
|
||||
"build:h5": "uni build",
|
||||
"build:h5:ssr": "uni build --ssr",
|
||||
"build:mp-alipay": "uni build -p mp-alipay",
|
||||
"build:mp-baidu": "uni build -p mp-baidu",
|
||||
"build:mp-jd": "uni build -p mp-jd",
|
||||
"build:mp-kuaishou": "uni build -p mp-kuaishou",
|
||||
"build:mp-lark": "uni build -p mp-lark",
|
||||
"build:mp-qq": "uni build -p mp-qq",
|
||||
"build:mp-toutiao": "uni build -p mp-toutiao",
|
||||
"build:mp-harmony": "uni build -p mp-harmony",
|
||||
"build:mp-weixin": "uni build -p mp-weixin",
|
||||
"build:mp-xhs": "uni build -p mp-xhs",
|
||||
"build:quickapp-webview": "uni build -p quickapp-webview",
|
||||
"build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
|
||||
"build:quickapp-webview-union": "uni build -p quickapp-webview-union",
|
||||
"type-check": "vue-tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-app-harmony": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-components": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-h5": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-harmony": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-mp-xhs": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-5020420260813003",
|
||||
"@wot-ui/ui": "^2.3.2",
|
||||
"miniprogram-api-typings": "^5.2.3",
|
||||
"vue": "^3.4.21",
|
||||
"vue-i18n": "^9.1.9"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/types": "^3.4.8",
|
||||
"@dcloudio/uni-automator": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-5020420260813003",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-5020420260813003",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-5020420260813003",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"@vue/runtime-core": "^3.4.21",
|
||||
"sass": "^1.98.0",
|
||||
"typescript": "^4.9.4",
|
||||
"unocss": "^66.8.1",
|
||||
"unocss-preset-weapp": "^66.0.2",
|
||||
"vite": "5.2.8",
|
||||
"vue-tsc": "^1.0.24"
|
||||
}
|
||||
}
|
||||
9967
pnpm-lock.yaml
generated
Normal file
9967
pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load Diff
10
shims-uni.d.ts
vendored
Normal file
10
shims-uni.d.ts
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
/// <reference types='@dcloudio/types' />
|
||||
import 'vue'
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
type Hooks = App.AppInstance & Page.PageInstance;
|
||||
|
||||
interface ComponentCustomOptions extends Hooks {
|
||||
|
||||
}
|
||||
}
|
||||
20
src/App.vue
Normal file
20
src/App.vue
Normal file
@@ -0,0 +1,20 @@
|
||||
<script setup lang="ts">
|
||||
import { onLaunch, onShow, onHide } from "@dcloudio/uni-app";
|
||||
onLaunch(() => {
|
||||
console.log("App Launch");
|
||||
});
|
||||
onShow(() => {
|
||||
console.log("App Show");
|
||||
});
|
||||
onHide(() => {
|
||||
console.log("App Hide");
|
||||
});
|
||||
</script>
|
||||
<style>
|
||||
page,
|
||||
.wd-root-portal {
|
||||
--wot-primary-5: #22c55e;
|
||||
--wot-primary-6: #16a34a;
|
||||
--wot-primary-7: #15803d;
|
||||
}
|
||||
</style>
|
||||
8
src/env.d.ts
vendored
Normal file
8
src/env.d.ts
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
/// <reference types="vite/client" />
|
||||
|
||||
declare module '*.vue' {
|
||||
import { DefineComponent } from 'vue'
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
|
||||
const component: DefineComponent<{}, {}, any>
|
||||
export default component
|
||||
}
|
||||
9
src/main.ts
Normal file
9
src/main.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import 'uno.css'
|
||||
import { createSSRApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
|
||||
return { app }
|
||||
}
|
||||
72
src/manifest.json
Normal file
72
src/manifest.json
Normal file
@@ -0,0 +1,72 @@
|
||||
{
|
||||
"name" : "",
|
||||
"appid" : "",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueStyleCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules" : {},
|
||||
/* 应用发布信息 */
|
||||
"distribute" : {
|
||||
/* android打包配置 */
|
||||
"android" : {
|
||||
"permissions" : [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
/* ios打包配置 */
|
||||
"ios" : {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs" : {}
|
||||
}
|
||||
},
|
||||
/* 快应用特有相关 */
|
||||
"quickapp" : {},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin" : {
|
||||
"appid" : "",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-toutiao" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"uniStatistics": {
|
||||
"enable": false
|
||||
},
|
||||
"vueVersion" : "3"
|
||||
}
|
||||
44
src/pages.json
Normal file
44
src/pages.json
Normal file
@@ -0,0 +1,44 @@
|
||||
{
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": { "navigationBarTitleText": "首页" }
|
||||
},
|
||||
{
|
||||
"path": "pages/user/index",
|
||||
"style": { "navigationBarTitleText": "我的" }
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
"color": "#999999",
|
||||
"selectedColor": "#4CAF50",
|
||||
"backgroundColor": "#ffffff",
|
||||
"borderStyle": "black",
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页",
|
||||
"iconPath": "static/tabs/home.png",
|
||||
"selectedIconPath": "static/tabs/home-active.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/user/index",
|
||||
"text": "我的",
|
||||
"iconPath": "static/tabs/user.png",
|
||||
"selectedIconPath": "static/tabs/user-active.png"
|
||||
}
|
||||
]
|
||||
},
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "uni-app",
|
||||
"navigationBarBackgroundColor": "#ffffff",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
},
|
||||
"easycom": {
|
||||
"autoscan": true,
|
||||
"custom": {
|
||||
"^wd-(.*)": "@wot-ui/ui/components/wd-$1/wd-$1.vue"
|
||||
}
|
||||
}
|
||||
}
|
||||
99
src/pages/index/index.vue
Normal file
99
src/pages/index/index.vue
Normal file
@@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<view class="min-h-screen flex flex-col" style="background-image: linear-gradient(180deg, #4CAF50 0%, #8BC34A 42%, #E8F5E9 100%)">
|
||||
<!-- 顶部 -->
|
||||
<view class="self-center py-3 flex items-center gap-2 text-gray-800">
|
||||
<wd-img :width="40" :height="40" :src="imgURL" />
|
||||
<view class="flex min-w-0 flex-col">
|
||||
<text class="truncate text-lg text-white font-semibold">
|
||||
{{ greeting }}
|
||||
</text>
|
||||
<text class="mt-0.5 text-xs text-white/70">
|
||||
{{ today }} · 记录每一次耕耘
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<wd-card title="1号菜地">
|
||||
<image src="https://wot-ui.cn/assets/panda.jpg" mode="aspectFill" />
|
||||
|
||||
<template #footer>
|
||||
<view class="flex-1 flex justify-between items-center">
|
||||
<view class="flex flex-col gap-1">
|
||||
<view class="text-base font-medium">
|
||||
西红柿
|
||||
<text class="text-sm text-gray-400 font-normal ml-1">粉果番茄</text>
|
||||
</view>
|
||||
<view class="flex gap-1 align-center">
|
||||
<wd-text text="🌱 生长期"/>
|
||||
<wd-text text="📅 2025-04-10"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex gap-1">
|
||||
<wd-button icon="edit" round></wd-button>
|
||||
<wd-button icon="list" round></wd-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</wd-card>
|
||||
|
||||
<wd-card title="2号菜地">
|
||||
<image src="https://wot-ui.cn/assets/redpanda.jpg" mode="aspectFill" />
|
||||
|
||||
<template #footer>
|
||||
<view class="flex-1 flex justify-between items-center">
|
||||
<view class="flex flex-col gap-1">
|
||||
<view class="text-base font-medium">
|
||||
黄瓜
|
||||
<text class="text-sm text-gray-400 font-normal ml-1">旱黄瓜</text>
|
||||
</view>
|
||||
<view class="flex gap-1 align-center">
|
||||
<wd-text text="🌱 开花期"/>
|
||||
<wd-text text="📅 2025-04-10"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex gap-1">
|
||||
<wd-button icon="edit" round></wd-button>
|
||||
<wd-button icon="list" round></wd-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</wd-card>
|
||||
|
||||
<view class="h-[10px]"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed } from 'vue'
|
||||
import { onShow } from '@dcloudio/uni-app'
|
||||
import appLogo from '@/static/logo.png'
|
||||
|
||||
defineOptions({ name: 'Home' })
|
||||
|
||||
const imgURL = appLogo
|
||||
|
||||
// ===== 时间 =====
|
||||
const now = new Date()
|
||||
const hour = now.getHours()
|
||||
|
||||
const greeting = computed(() => {
|
||||
if (hour < 6) return '夜深了 🌙'
|
||||
if (hour < 12) return '早上好 ☀️'
|
||||
if (hour < 18) return '下午好 👋'
|
||||
return '晚上好 ✨'
|
||||
})
|
||||
|
||||
const today = computed(() => {
|
||||
const m = now.getMonth() + 1
|
||||
const d = now.getDate()
|
||||
const w = ['日', '一', '二', '三', '四', '五', '六'][now.getDay()]
|
||||
return `${m}月${d}日 周${w}`
|
||||
})
|
||||
|
||||
|
||||
onShow(() => loadData())
|
||||
|
||||
function loadData() {
|
||||
|
||||
}
|
||||
</script>
|
||||
105
src/pages/user/index.vue
Normal file
105
src/pages/user/index.vue
Normal file
@@ -0,0 +1,105 @@
|
||||
<template>
|
||||
<view class="min-h-screen flex flex-col" style="background-image: linear-gradient(180deg, #4CAF50 0%, #8BC34A 42%, #E8F5E9 100%)">
|
||||
<wd-segmented :options="list" v-model:value="current"
|
||||
custom-style="align-self: center; width: 60%; margin-top: 10px;"></wd-segmented>
|
||||
|
||||
<view class="self-center py-3 flex items-center gap-2 text-gray-800">
|
||||
<view class="flex min-w-0 flex-col">
|
||||
<text class="truncate text-lg text-white font-semibold">
|
||||
西红柿
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<wd-card>
|
||||
<template #title>
|
||||
<view class="w-full flex flex-col gap-1.5">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-base font-medium">💧 浇水</view>
|
||||
<wd-tag type="primary" round>🌱 开花期</wd-tag>
|
||||
<view class="text-xs text-gray-400">06-20 08:30</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<view class="flex flex-col gap-2">
|
||||
<text class="text-sm text-gray-500">浇透水,土壤湿度约70%</text>
|
||||
</view>
|
||||
</wd-card>
|
||||
|
||||
<wd-card>
|
||||
<template #title>
|
||||
<view class="w-full flex flex-col gap-1.5">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-base font-medium">🌿 施肥</view>
|
||||
<wd-tag type="primary" round>🌱 开花期</wd-tag>
|
||||
<view class="text-xs text-gray-400">06-18 17:00</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<view class="flex flex-col gap-2">
|
||||
<image
|
||||
src="https://wot-ui.cn/assets/panda.jpg"
|
||||
mode="aspectFill"
|
||||
class="rounded-lg"
|
||||
/>
|
||||
<text class="text-sm text-gray-500">追施磷酸二氢钾,800倍叶面喷施</text>
|
||||
</view>
|
||||
</wd-card>
|
||||
|
||||
<wd-card>
|
||||
<template #title>
|
||||
<view class="w-full flex flex-col gap-1.5">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-base font-medium">🐛 病虫害防治</view>
|
||||
<wd-tag type="warning" round>⚠️ 发现蚜虫</wd-tag>
|
||||
<view class="text-xs text-gray-400">06-15 09:00</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<view class="flex flex-col gap-2">
|
||||
<text class="text-sm text-gray-500">叶片背面发现少量蚜虫,喷施吡虫啉1000倍液</text>
|
||||
</view>
|
||||
</wd-card>
|
||||
|
||||
<wd-card>
|
||||
<template #title>
|
||||
<view class="w-full flex flex-col gap-1.5">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-base font-medium">✂️ 整枝打杈</view>
|
||||
<wd-tag type="primary" round>🌱 开花期</wd-tag>
|
||||
<view class="text-xs text-gray-400">06-12 16:30</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<view class="flex flex-col gap-2">
|
||||
<text class="text-sm text-gray-500">摘除第一穗花以下所有侧枝,保留主蔓</text>
|
||||
</view>
|
||||
</wd-card>
|
||||
|
||||
<!-- 04-10 播种(最早) -->
|
||||
<wd-card>
|
||||
<template #title>
|
||||
<view class="w-full flex flex-col gap-1.5">
|
||||
<view class="flex justify-between items-center">
|
||||
<view class="text-base font-medium">🌱 播种</view>
|
||||
<wd-tag type="success" round>📅 苗期</wd-tag>
|
||||
<view class="text-xs text-gray-400">04-10 10:00</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<view class="flex flex-col gap-2">
|
||||
<text class="text-sm text-gray-500">穴盘育苗,覆土1cm,浇透水,放置于温暖通风处</text>
|
||||
</view>
|
||||
</wd-card>
|
||||
|
||||
<view class="h-[10px]"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
|
||||
const list = ref<string[]>(['当前种植', '历史种植'])
|
||||
|
||||
const current = ref('点赞')
|
||||
</script>
|
||||
6
src/shime-uni.d.ts
vendored
Normal file
6
src/shime-uni.d.ts
vendored
Normal file
@@ -0,0 +1,6 @@
|
||||
export {}
|
||||
|
||||
declare module "vue" {
|
||||
type Hooks = App.AppInstance & Page.PageInstance;
|
||||
interface ComponentCustomOptions extends Hooks {}
|
||||
}
|
||||
BIN
src/static/logo.png
Normal file
BIN
src/static/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.9 KiB |
BIN
src/static/tabs/home-active.png
Normal file
BIN
src/static/tabs/home-active.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
BIN
src/static/tabs/home.png
Normal file
BIN
src/static/tabs/home.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.9 KiB |
BIN
src/static/tabs/user-active.png
Normal file
BIN
src/static/tabs/user-active.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.4 KiB |
BIN
src/static/tabs/user.png
Normal file
BIN
src/static/tabs/user.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.0 KiB |
76
src/uni.scss
Normal file
76
src/uni.scss
Normal file
@@ -0,0 +1,76 @@
|
||||
/**
|
||||
* 这里是uni-app内置的常用样式变量
|
||||
*
|
||||
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
|
||||
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
|
||||
*
|
||||
*/
|
||||
|
||||
/**
|
||||
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
|
||||
*
|
||||
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
|
||||
*/
|
||||
|
||||
/* 颜色变量 */
|
||||
|
||||
/* 行为相关颜色 */
|
||||
$uni-color-primary: #007aff;
|
||||
$uni-color-success: #4cd964;
|
||||
$uni-color-warning: #f0ad4e;
|
||||
$uni-color-error: #dd524d;
|
||||
|
||||
/* 文字基本颜色 */
|
||||
$uni-text-color: #333; // 基本色
|
||||
$uni-text-color-inverse: #fff; // 反色
|
||||
$uni-text-color-grey: #999; // 辅助灰色,如加载更多的提示信息
|
||||
$uni-text-color-placeholder: #808080;
|
||||
$uni-text-color-disable: #c0c0c0;
|
||||
|
||||
/* 背景颜色 */
|
||||
$uni-bg-color: #fff;
|
||||
$uni-bg-color-grey: #f8f8f8;
|
||||
$uni-bg-color-hover: #f1f1f1; // 点击状态颜色
|
||||
$uni-bg-color-mask: rgba(0, 0, 0, 0.4); // 遮罩颜色
|
||||
|
||||
/* 边框颜色 */
|
||||
$uni-border-color: #c8c7cc;
|
||||
|
||||
/* 尺寸变量 */
|
||||
|
||||
/* 文字尺寸 */
|
||||
$uni-font-size-sm: 12px;
|
||||
$uni-font-size-base: 14px;
|
||||
$uni-font-size-lg: 16;
|
||||
|
||||
/* 图片尺寸 */
|
||||
$uni-img-size-sm: 20px;
|
||||
$uni-img-size-base: 26px;
|
||||
$uni-img-size-lg: 40px;
|
||||
|
||||
/* Border Radius */
|
||||
$uni-border-radius-sm: 2px;
|
||||
$uni-border-radius-base: 3px;
|
||||
$uni-border-radius-lg: 6px;
|
||||
$uni-border-radius-circle: 50%;
|
||||
|
||||
/* 水平间距 */
|
||||
$uni-spacing-row-sm: 5px;
|
||||
$uni-spacing-row-base: 10px;
|
||||
$uni-spacing-row-lg: 15px;
|
||||
|
||||
/* 垂直间距 */
|
||||
$uni-spacing-col-sm: 4px;
|
||||
$uni-spacing-col-base: 8px;
|
||||
$uni-spacing-col-lg: 12px;
|
||||
|
||||
/* 透明度 */
|
||||
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度
|
||||
|
||||
/* 文章场景相关 */
|
||||
$uni-color-title: #2c405a; // 文章标题颜色
|
||||
$uni-font-size-title: 20px;
|
||||
$uni-color-subtitle: #555; // 二级标题颜色
|
||||
$uni-font-size-subtitle: 18px;
|
||||
$uni-color-paragraph: #3f536e; // 文章段落颜色
|
||||
$uni-font-size-paragraph: 15px;
|
||||
13
tsconfig.json
Normal file
13
tsconfig.json
Normal file
@@ -0,0 +1,13 @@
|
||||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"sourceMap": true,
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
},
|
||||
"lib": ["esnext", "dom"],
|
||||
"types": ["@dcloudio/types", "miniprogram-api-typings"]
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
|
||||
}
|
||||
20
unocss.config.ts
Normal file
20
unocss.config.ts
Normal file
@@ -0,0 +1,20 @@
|
||||
import { defineConfig } from 'unocss'
|
||||
import presetWeapp from 'unocss-preset-weapp'
|
||||
import { extractorAttributify, transformerClass } from 'unocss-preset-weapp/transformer'
|
||||
|
||||
const { presetWeappAttributify, transformerAttributify } = extractorAttributify()
|
||||
|
||||
export default defineConfig({
|
||||
presets: [
|
||||
presetWeapp(), // 小程序预设,默认单位 rpx:w-100 => width:100rpx
|
||||
presetWeappAttributify()
|
||||
],
|
||||
shortcuts: {
|
||||
center: 'flex justify-center items-center',
|
||||
'btn-primary': 'bg-blue-500 text-white rounded'
|
||||
},
|
||||
transformers: [
|
||||
transformerAttributify(),
|
||||
transformerClass() // 解决小程序不支持 \ : [ ] $ 等特殊字符
|
||||
]
|
||||
})
|
||||
12
vite.config.ts
Normal file
12
vite.config.ts
Normal file
@@ -0,0 +1,12 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import uni from '@dcloudio/vite-plugin-uni'
|
||||
|
||||
export default defineConfig(async () => {
|
||||
const UnoCSS = (await import('unocss/vite')).default // 0.59+ 纯 ESM,动态导入更稳
|
||||
return {
|
||||
plugins: [
|
||||
uni(),
|
||||
UnoCSS()
|
||||
]
|
||||
}
|
||||
})
|
||||
Reference in New Issue
Block a user