From 6642970eefdf5886175704b504421bad43d44fed Mon Sep 17 00:00:00 2001 From: DCloud_LXH <283700113@qq.com> Date: Wed, 2 Nov 2022 13:49:59 +0800 Subject: [PATCH] fix(app): darkmode --- packages/uni-cli-shared/lib/index.js | 5 ++- packages/uni-cli-shared/lib/theme.js | 2 +- .../packages/postcss/index.js | 2 +- .../packages/postcss/index.v3.js | 40 ++++++++++++++++++- 4 files changed, 44 insertions(+), 5 deletions(-) diff --git a/packages/uni-cli-shared/lib/index.js b/packages/uni-cli-shared/lib/index.js index a2d06340e..60ed9fcec 100644 --- a/packages/uni-cli-shared/lib/index.js +++ b/packages/uni-cli-shared/lib/index.js @@ -65,7 +65,7 @@ const { const uts = require('./uts') -const { parseTheme } = require('./theme') +const { parseTheme, initTheme } = require('./theme') module.exports = { uts, @@ -118,5 +118,6 @@ module.exports = { getPlatformStat, getPlatformPush, getPlatformUniCloud, - parseTheme + parseTheme, + initTheme } diff --git a/packages/uni-cli-shared/lib/theme.js b/packages/uni-cli-shared/lib/theme.js index 01c2e60ef..13bc0be31 100644 --- a/packages/uni-cli-shared/lib/theme.js +++ b/packages/uni-cli-shared/lib/theme.js @@ -41,7 +41,7 @@ module.exports = { return } try { - themeConfig = getJson(themeLocation, true) + themeConfig = Object.keys(themeConfig).length ? themeConfig : getJson(themeLocation, true) global.uniPlugin.defaultTheme = themeConfig.light } catch (e) { console.error(e) diff --git a/packages/vue-cli-plugin-uni/packages/postcss/index.js b/packages/vue-cli-plugin-uni/packages/postcss/index.js index 9a57986ec..364b64c6e 100644 --- a/packages/vue-cli-plugin-uni/packages/postcss/index.js +++ b/packages/vue-cli-plugin-uni/packages/postcss/index.js @@ -296,7 +296,7 @@ if (process.env.UNI_USING_V3) { const version = Number(require('postcss/package.json').version.split('.')[0]) - if (version <= 8) { + if (version < 8) { module.exports = postcss.plugin('postcss-uniapp-plugin', fn) } else { module.exports = function (opts) { diff --git a/packages/vue-cli-plugin-uni/packages/postcss/index.v3.js b/packages/vue-cli-plugin-uni/packages/postcss/index.v3.js index 602d6bda9..5498d6883 100644 --- a/packages/vue-cli-plugin-uni/packages/postcss/index.v3.js +++ b/packages/vue-cli-plugin-uni/packages/postcss/index.v3.js @@ -1,6 +1,16 @@ const selectorParser = require('postcss-selector-parser') +const postcss = require('postcss') -const TAGS = Object.keys(require('@dcloudio/uni-cli-shared').tags) +const { + initTheme, + parseTheme, + getJson, + getManifestJson, + tags +} = require('@dcloudio/uni-cli-shared') + +const TAGS = Object.keys(tags) +const pageJson = getJson('pages.json', true) const transformSelector = (complexSelector, transformer) => { return selectorParser(transformer).processSync(complexSelector) @@ -41,6 +51,34 @@ function once (root) { ) } }) + + // darkmode + if ( + process.env.VUE_APP_DARK_MODE === 'true' && + root.source.input.file.indexOf('App.vue') !== -1 + ) { + const pageBGC = (pageJson.globalStyle || {}).backgroundColor || '' + if (pageBGC.indexOf('@') === 0) { + // app 端 webpack-uni-pages-loader/lib/index-new.js 执行晚于 postCss + initTheme(getManifestJson()) + ;['dark', 'light'].forEach(theme => { + const { backgroundColor } = parseTheme({ backgroundColor: pageBGC }, theme) + if (backgroundColor !== 'undefined') { + const mediaRoot = postcss.parse(` + /* #ifndef APP-NVUE*/ + @media (prefers-color-scheme: ${theme}) { + body, + uni-page-body { + background-color: ${backgroundColor}; + } + } + /* #endif */ + `) + root.nodes = [...mediaRoot.nodes, ...root.nodes] + } + }) + } + } } const version = Number(require('postcss/package.json').version.split('.')[0]) -- GitLab