diff --git a/packages/shims-node.d.ts b/packages/shims-node.d.ts index f822e5b04244d8f34e6bfa7fc5bd7b145b94942b..ab79ca1751970b6135fe7a8e6c086b985a2a532f 100644 --- a/packages/shims-node.d.ts +++ b/packages/shims-node.d.ts @@ -13,5 +13,6 @@ declare namespace NodeJS { UNI_RENDERER?: 'native' UNI_NVUE_COMPILER: 'uni-app' | 'weex' | 'vue' UNI_NVUE_STYLE_COMPILER: 'uni-app' | 'weex' + UNI_APP_CODE_SPLITING?: 'true' } } diff --git a/packages/uni-app-plus/dist/uni-app-service.es.js b/packages/uni-app-plus/dist/uni-app-service.es.js index 4e84b5fe7f8d6c669236375244c1cadbeabb2edb..948eb2d6a2e21e4c76aa70093789bc931ecde95f 100644 --- a/packages/uni-app-plus/dist/uni-app-service.es.js +++ b/packages/uni-app-plus/dist/uni-app-service.es.js @@ -6154,7 +6154,7 @@ var serviceContext = (function (vue) { baseCheckIsSupportSoterAuthentication(resolve); }); const basecheckIsSoterEnrolledInDevice = ({ checkAuthMode, resolve, reject, }) => { - const wrapReject = (errMsg, errRes) => reject && reject(errMsg, ...errRes); + const wrapReject = (errMsg, errRes) => reject && reject(errMsg, errRes); const wrapResolve = (res) => resolve && resolve(res); if (checkAuthMode === 'fingerPrint') { if (checkIsSupportFingerPrint()) { diff --git a/packages/uni-app-plus/dist/uni-app-view.umd.js b/packages/uni-app-plus/dist/uni-app-view.umd.js index fa23fcfbcd9d29778a5680301fd81a1d48a19f73..5b1b2f0bcdbf417c376734e2a0e4096b84833bbd 100644 --- a/packages/uni-app-plus/dist/uni-app-view.umd.js +++ b/packages/uni-app-plus/dist/uni-app-view.umd.js @@ -14852,7 +14852,7 @@ var canvas = "uni-canvas {\n width: 300px;\n height: 150px;\n display: block;\n position: relative;\n}\n\nuni-canvas > .uni-canvas-canvas {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n}\n"; class UniCanvas extends UniComponent { constructor(id2, parentNodeId, refNodeId, nodeJson) { - super(id2, "uni-canvas", Canvas, parentNodeId, refNodeId, nodeJson, "canvas > div"); + super(id2, "uni-canvas", Canvas, parentNodeId, refNodeId, nodeJson, "uni-canvas > div"); } } var checkbox = "uni-checkbox {\n -webkit-tap-highlight-color: transparent;\n display: inline-block;\n cursor: pointer;\n}\n\nuni-checkbox[hidden] {\n display: none;\n}\n\nuni-checkbox[disabled] {\n cursor: not-allowed;\n}\n\n.uni-checkbox-wrapper {\n display: inline-flex;\n align-items: center;\n vertical-align: middle;\n}\n\n.uni-checkbox-input {\n margin-right: 5px;\n -webkit-appearance: none;\n appearance: none;\n outline: 0;\n border: 1px solid #d1d1d1;\n background-color: #ffffff;\n border-radius: 3px;\n width: 22px;\n height: 22px;\n position: relative;\n}\n\n.uni-checkbox-input svg {\n color: #007aff;\n font-size: 22px;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -48%) scale(0.73);\n}\n\nuni-checkbox:not([disabled]) .uni-checkbox-input:hover {\n border-color: #007aff;\n}\n\n.uni-checkbox-input.uni-checkbox-input-disabled {\n background-color: #e1e1e1;\n}\n\n.uni-checkbox-input.uni-checkbox-input-disabled:before {\n color: #adadad;\n}\n\nuni-checkbox-group {\n display: block;\n}\n"; diff --git a/packages/uni-app-vite/dist/index.js b/packages/uni-app-vite/dist/index.js index b1e6e8ba6283d6e3749236cc48716b9cc090eee2..ff1c5f10fd2bedaf9dbb783f306de06a8d151910 100644 --- a/packages/uni-app-vite/dist/index.js +++ b/packages/uni-app-vite/dist/index.js @@ -1,9 +1,5 @@ "use strict"; -var __importDefault = (this && this.__importDefault) || function (mod) { - return (mod && mod.__esModule) ? mod : { "default": mod }; -}; Object.defineProperty(exports, "__esModule", { value: true }); -const fs_1 = __importDefault(require("fs")); const uni_cli_shared_1 = require("@dcloudio/uni-cli-shared"); const plugin_1 = require("./plugin"); const copy_1 = require("./plugins/copy"); @@ -20,9 +16,4 @@ const plugins = [ uni_cli_shared_1.uniViteInjectPlugin(uni_cli_shared_1.initProvide()), plugin_1.UniAppPlugin, ]; -if (!process.env.UNI_APP_CODE_SPLITING) { - plugins.push(uni_cli_shared_1.uniCssPlugin({ - app: fs_1.default.readFileSync(require.resolve('@dcloudio/uni-app-plus/dist/style.css'), 'utf8'), - })); -} exports.default = plugins; diff --git a/packages/uni-app-vite/dist/plugin/configResolved.js b/packages/uni-app-vite/dist/plugin/configResolved.js index 1886725b381a0e5925d419c4d6ec4a26581aa6bc..5bf4aab991862bc1ad60a85869bc2fc0c0fe0730 100644 --- a/packages/uni-app-vite/dist/plugin/configResolved.js +++ b/packages/uni-app-vite/dist/plugin/configResolved.js @@ -3,11 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true }); exports.configResolved = void 0; const uni_cli_shared_1 = require("@dcloudio/uni-cli-shared"); const configResolved = (config) => { - // 移除 vite 内置的 css post 处理，交由 @dcloudio/uni-cli-shared 的 uniCssPlugin 实现 - uni_cli_shared_1.removePlugins(['vite:css-post'], config); - // removePlugins('vite:import-analysis', config) - // injectCssPlugin(config) - // injectCssPostPlugin(config) - // injectAssetPlugin(config) + uni_cli_shared_1.removePlugins('vite:import-analysis', config); + uni_cli_shared_1.injectCssPlugin(config); + uni_cli_shared_1.injectCssPostPlugin(config); + uni_cli_shared_1.injectAssetPlugin(config); }; exports.configResolved = configResolved; diff --git a/packages/uni-app-vite/dist/plugins/mainJs.js b/packages/uni-app-vite/dist/plugins/mainJs.js index fa136dbbef3afd715446134e84b9cd7d50efc227..07c092eb7fd326e4933ce0dee65ad5b3dbbde7d7 100644 --- a/packages/uni-app-vite/dist/plugins/mainJs.js +++ b/packages/uni-app-vite/dist/plugins/mainJs.js @@ -23,8 +23,8 @@ function uniMainJsPlugin() { } exports.uniMainJsPlugin = uniMainJsPlugin; function createApp(code) { - return `const __app__=createApp().app;__app__._component.render=()=>{};__app__.use(uni.__vuePlugin).mount("#app");${code.replace('createSSRApp', 'createVueApp as createSSRApp')}`; + return `const __app__=createApp().app;__app__._component.mpType='app';__app__._component.render=()=>{};__app__.use(uni.__vuePlugin).mount("#app");${code.replace('createSSRApp', 'createVueApp as createSSRApp')}`; } function createLegacyApp(code) { - return `function createApp(rootComponent,rootProps){const app=createVueApp(rootComponent,rootProps).use(uni.__vuePlugin);app.render=()=>{};const oldMount=app.mount;app.mount=(container)=>{const appVm=oldMount.call(app,container);return appVm;};return app;};${code.replace('createApp', 'createVueApp')}`; + return `function createApp(rootComponent,rootProps){rootComponent.mpTye='app';const app=createVueApp(rootComponent,rootProps).use(uni.__vuePlugin);app.render=()=>{};const oldMount=app.mount;app.mount=(container)=>{const appVm=oldMount.call(app,container);return appVm;};return app;};${code.replace('createApp', 'createVueApp')}`; } diff --git a/packages/uni-app-vite/src/index.ts b/packages/uni-app-vite/src/index.ts index a8a3fad6b28f33d12c1835cdd63443b8ca63b5d1..926bbab9f01047e38e8bb02ee1f0538cb5ed6bfa 100644 --- a/packages/uni-app-vite/src/index.ts +++ b/packages/uni-app-vite/src/index.ts @@ -1,9 +1,4 @@ -import fs from 'fs' -import { - initProvide, - uniCssPlugin, - uniViteInjectPlugin, -} from '@dcloudio/uni-cli-shared' +import { initProvide, uniViteInjectPlugin } from '@dcloudio/uni-cli-shared' import { UniAppPlugin } from './plugin' import { uniCopyPlugin } from './plugins/copy' import { uniMainJsPlugin } from './plugins/mainJs' @@ -20,14 +15,4 @@ const plugins = [ uniViteInjectPlugin(initProvide()), UniAppPlugin, ] -if (!process.env.UNI_APP_CODE_SPLITING) { - plugins.push( - uniCssPlugin({ - app: fs.readFileSync( - require.resolve('@dcloudio/uni-app-plus/dist/style.css'), - 'utf8' - ), - }) - ) -} export default plugins diff --git a/packages/uni-app-vite/src/plugin/configResolved.ts b/packages/uni-app-vite/src/plugin/configResolved.ts index 908419613842e8c4026234891b05bd05bb5d4a1e..ba179033c551d1dd19edb071999681d8660cb504 100644 --- a/packages/uni-app-vite/src/plugin/configResolved.ts +++ b/packages/uni-app-vite/src/plugin/configResolved.ts @@ -2,17 +2,14 @@ import { Plugin } from 'vite' import { removePlugins, - // injectAssetPlugin, - // injectCssPlugin, - // injectCssPostPlugin, + injectAssetPlugin, + injectCssPlugin, + injectCssPostPlugin, } from '@dcloudio/uni-cli-shared' export const configResolved: Plugin['configResolved'] = (config) => { - // 移除 vite 内置的 css post 处理，交由 @dcloudio/uni-cli-shared 的 uniCssPlugin 实现 - removePlugins(['vite:css-post'], config) - - // removePlugins('vite:import-analysis', config) - // injectCssPlugin(config) - // injectCssPostPlugin(config) - // injectAssetPlugin(config) + removePlugins('vite:import-analysis', config) + injectCssPlugin(config) + injectCssPostPlugin(config) + injectAssetPlugin(config) } diff --git a/packages/uni-app-vite/src/plugins/mainJs.ts b/packages/uni-app-vite/src/plugins/mainJs.ts index 52ba85a1f77c938f92e56f662be2f73d7b1e564b..baf7ae08a6174543a92f9bde8b7752df96605302 100644 --- a/packages/uni-app-vite/src/plugins/mainJs.ts +++ b/packages/uni-app-vite/src/plugins/mainJs.ts @@ -21,14 +21,14 @@ export function uniMainJsPlugin() { } function createApp(code: string) { - return `const __app__=createApp().app;__app__._component.render=()=>{};__app__.use(uni.__vuePlugin).mount("#app");${code.replace( + return `const __app__=createApp().app;__app__._component.mpType='app';__app__._component.render=()=>{};__app__.use(uni.__vuePlugin).mount("#app");${code.replace( 'createSSRApp', 'createVueApp as createSSRApp' )}` } function createLegacyApp(code: string) { - return `function createApp(rootComponent,rootProps){const app=createVueApp(rootComponent,rootProps).use(uni.__vuePlugin);app.render=()=>{};const oldMount=app.mount;app.mount=(container)=>{const appVm=oldMount.call(app,container);return appVm;};return app;};${code.replace( + return `function createApp(rootComponent,rootProps){rootComponent.mpTye='app';const app=createVueApp(rootComponent,rootProps).use(uni.__vuePlugin);app.render=()=>{};const oldMount=app.mount;app.mount=(container)=>{const appVm=oldMount.call(app,container);return appVm;};return app;};${code.replace( 'createApp', 'createVueApp' )}` diff --git a/packages/uni-cli-shared/src/json/app/manifest/env.ts b/packages/uni-cli-shared/src/json/app/manifest/env.ts new file mode 100644 index 0000000000000000000000000000000000000000..8067d73767f45b5ee9fc482cf33762fed20f798d --- /dev/null +++ b/packages/uni-cli-shared/src/json/app/manifest/env.ts @@ -0,0 +1,14 @@ +export function getAppRenderer(manifestJson: Record) { + const platformOptions = manifestJson['app-plus'] + if (platformOptions && platformOptions.renderer === 'native') { + return 'native' + } + return '' +} + +export function getAppCodeSpliting(manifestJson: Record) { + if (manifestJson['app-plus']?.optimization?.codeSpliting === true) { + return true + } + return false +} diff --git a/packages/uni-cli-shared/src/json/app/manifest/index.ts b/packages/uni-cli-shared/src/json/app/manifest/index.ts index c83b3a5e6d216aaaf9569e8368d1c8617ccf8ef6..72f2314aedfc4b9dc9fd350877e51566e76c2966 100644 --- a/packages/uni-cli-shared/src/json/app/manifest/index.ts +++ b/packages/uni-cli-shared/src/json/app/manifest/index.ts @@ -35,8 +35,9 @@ export function normalizeAppManifestJson( return manifestJson } +export { getAppRenderer, getAppCodeSpliting } from './env' + export { - getRenderer, getNVueCompiler, getNVueStyleCompiler, getNVueFlexDirection, diff --git a/packages/uni-cli-shared/src/json/app/manifest/nvue.ts b/packages/uni-cli-shared/src/json/app/manifest/nvue.ts index 4284b3cc52cb85176950dad0254a5b156c30d942..7a8812e8d0f46775bd7d8bfd6d7515da33c99630 100644 --- a/packages/uni-cli-shared/src/json/app/manifest/nvue.ts +++ b/packages/uni-cli-shared/src/json/app/manifest/nvue.ts @@ -3,14 +3,6 @@ export function initNVue( pagesJson: UniApp.PagesJson ) {} -export function getRenderer(manifestJson: Record) { - const platformOptions = manifestJson['app-plus'] - if (platformOptions && platformOptions.renderer === 'native') { - return 'native' - } - return '' -} - export function getNVueCompiler(manifestJson: Record) { const platformOptions = manifestJson['app-plus'] if (platformOptions) { diff --git a/packages/uni-cli-shared/src/vite/plugins/css.ts b/packages/uni-cli-shared/src/vite/plugins/css.ts index 381258b9e463b4e5221b1da99e7e72eb9e6bbeb0..d5da5c2c32a67b882639c5683b1ba56263adc511 100644 --- a/packages/uni-cli-shared/src/vite/plugins/css.ts +++ b/packages/uni-cli-shared/src/vite/plugins/css.ts @@ -1,9 +1,8 @@ import path from 'path' import debug from 'debug' -import { Plugin, ResolvedConfig } from 'vite' +import { Plugin } from 'vite' import { normalizePath, resolveMainPathOnce } from '../../utils' import { EXTNAME_VUE_RE } from '../../constants' -import { minifyCSS } from './vitejs/plugins/css' const cssLangs = `\\.(css|less|sass|scss|styl|stylus|pcss|postcss)($|\\?)` const cssLangRE = new RegExp(cssLangs) @@ -38,12 +37,8 @@ interface UniCssPluginOptions { export function uniCssPlugin({ app }: UniCssPluginOptions): Plugin { const styles: Map = new Map() let cssChunks: Map> - let resolvedConfig: ResolvedConfig return { name: 'vite:uni-app-css', - configResolved(config) { - resolvedConfig = config - }, buildStart() { cssChunks = new Map>() }, @@ -105,9 +100,9 @@ export function uniCssPlugin({ app }: UniCssPluginOptions): Plugin { for (const fileName of cssChunks.keys()) { let source = (fileName === 'app.css' ? app + '\n' : '') + genCssCode(fileName) - if (resolvedConfig.build.minify) { - source = await minifyCSS(source, resolvedConfig) - } + // if (resolvedConfig.build.minify) { + // source = await minifyCSS(source, resolvedConfig) + // } this.emitFile({ fileName, type: 'asset', diff --git a/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/asset.ts b/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/asset.ts index 636e39039c2a8de98f496612c15e118a00848a43..0a0073e6fbee1f250b37dc4e49ca20f6c9f5b419 100644 --- a/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/asset.ts +++ b/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/asset.ts @@ -176,7 +176,7 @@ function fileToBuiltUrl( const contentHash = getAssetHash(content) const { search, hash } = parseUrl(id) const postfix = (search || '') + (hash || '') - const fileName = '/' + path.posix.relative(process.env.UNI_INPUT_DIR, id) + const fileName = path.posix.relative(process.env.UNI_INPUT_DIR, id) if (!map.has(contentHash)) { map.set(contentHash, fileName) } diff --git a/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/css.ts b/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/css.ts index 48fae8e7d2071778da58768c52062a478d11466a..60a3453719682204501e292d92bc8bdbf5922550 100644 --- a/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/css.ts +++ b/packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/css.ts @@ -15,25 +15,10 @@ import { import { Plugin } from '../plugin' import { ResolvedConfig } from '../config' import postcssrc from 'postcss-load-config' -import { - NormalizedOutputOptions, - OutputChunk, - RenderedChunk, - RollupError, - SourceMap, -} from 'rollup' -import { dataToEsm } from '@rollup/pluginutils' +import { PluginContext, RollupError, SourceMap } from 'rollup' import chalk from 'chalk' -import { CLIENT_PUBLIC_PATH } from '../constants' import { ResolveFn, ViteDevServer } from '../' -import { - getAssetFilename, - assetUrlRE, - registerAssetToChunk, - fileToUrl, - checkPublicFile, -} from './asset' -import MagicString from 'magic-string' +import { fileToUrl, assetUrlRE, getAssetFilename } from './asset' import * as Postcss from 'postcss' import type Sass from 'sass' // We need to disable check of extraneous import which is buggy for stylus, @@ -41,9 +26,10 @@ import type Sass from 'sass' import type Stylus from 'stylus' import type Less from 'less' import { Alias } from 'types/alias' -import type { ModuleNode } from '../server/moduleGraph' import { transform, formatMessages } from 'esbuild' +import { resolveMainPathOnce } from '../../../../utils' +import { EXTNAME_VUE_RE } from '../../../../constants' // const debug = createDebugger('vite:css') export interface CSSOptions { @@ -87,7 +73,6 @@ export const cssLangRE = new RegExp(cssLangs) const cssModuleRE = new RegExp(`\\.module${cssLangs}`) const directRequestRE = /(\?|&)direct\b/ const commonjsProxyRE = /\?commonjs-proxy/ -const inlineRE = /(\?|&)inline\b/ const enum PreprocessLang { less = 'less', @@ -112,11 +97,6 @@ const cssModulesCache = new WeakMap< Map> >() -export const chunkToEmittedCssFileMap = new WeakMap< - RenderedChunk, - Set ->() - const postcssConfigCache = new WeakMap< ResolvedConfig, PostCSSConfigResult | null @@ -155,8 +135,9 @@ export function cssPlugin(config: ResolvedConfig): Plugin { } const urlReplacer: CssUrlReplacer = async (url, importer) => { - if (checkPublicFile(url, config)) { - return config.base + url.slice(1) + if (url.startsWith('/') && !url.startsWith('//')) { + // /static/logo.png => @/static/logo.png + url = '@' + url } const resolved = await resolveUrl(url, importer) if (resolved) { @@ -188,44 +169,6 @@ export function cssPlugin(config: ResolvedConfig): Plugin { } } - // dev - if (server) { - // server only logic for handling CSS @import dependency hmr - const { moduleGraph } = server - const thisModule = moduleGraph.getModuleById(id) - if (thisModule) { - // CSS modules cannot self-accept since it exports values - const isSelfAccepting = !modules - if (deps) { - // record deps in the module graph so edits to @import css can trigger - // main import to hot update - const depModules = new Set() - for (const file of deps) { - depModules.add( - cssLangRE.test(file) - ? moduleGraph.createFileOnlyEntry(file) - : await moduleGraph.ensureEntryFromUrl( - await fileToUrl(file, config, this) - ) - ) - } - moduleGraph.updateModuleInfo( - thisModule, - depModules, - // The root CSS proxy module is self-accepting and should not - // have an explicit accept list - new Set(), - isSelfAccepting - ) - for (const file of deps) { - this.addWatchFile(file) - } - } else { - thisModule.isSelfAccepting = isSelfAccepting - } - } - } - return { code: css, // TODO CSS source map @@ -235,255 +178,130 @@ export function cssPlugin(config: ResolvedConfig): Plugin { } } +function normalizeCssChunkFilename(id: string) { + return normalizePath( + path.relative( + process.env.UNI_INPUT_DIR, + id.split('?')[0].replace(EXTNAME_VUE_RE, '.css') + ) + ) +} + +function findCssModuleIds( + this: PluginContext, + moduleId: string, + cssModuleIds?: Set +) { + if (!cssModuleIds) { + cssModuleIds = new Set() + } + const moduleInfo = this.getModuleInfo(moduleId) + if (moduleInfo) { + moduleInfo.importedIds.forEach((id) => { + if (id.includes('pages.json.js')) { + // 查询main.js时，需要忽略pages.json.js，否则会把所有页面样式加进来 + return + } + if (cssLangRE.test(id) && !commonjsProxyRE.test(id)) { + cssModuleIds!.add(id) + } else { + findCssModuleIds.call(this, id, cssModuleIds) + } + }) + } + return cssModuleIds +} + /** * Plugin applied after user plugins */ export function cssPostPlugin(config: ResolvedConfig): Plugin { // styles initialization in buildStart causes a styling loss in watch const styles: Map = new Map() - let pureCssChunks: Set - - // when there are multiple rollup outputs and extracting CSS, only emit once, - // since output formats have no effect on the generated CSS. - let outputToExtractedCSSMap: Map - let hasEmitted = false - + let cssChunks: Map> + const viewCssCode = fs.readFileSync( + require.resolve('@dcloudio/uni-app-plus/dist/style.css'), + 'utf8' + ) return { name: 'vite:css-post', - buildStart() { - // Ensure new caches for every build (i.e. rebuilding in watch mode) - pureCssChunks = new Set() - outputToExtractedCSSMap = new Map() - hasEmitted = false + cssChunks = new Map>() }, - async transform(css, id, ssr) { if (!cssLangRE.test(id) || commonjsProxyRE.test(id)) { return } - - const inlined = inlineRE.test(id) - const modules = cssModulesCache.get(config)!.get(id) - const modulesCode = - modules && dataToEsm(modules, { namedExports: true, preferConst: true }) - - if (config.command === 'serve') { - if (isDirectCSSRequest(id)) { - return css - } else { - // server only - if (ssr) { - return modulesCode || `export default ${JSON.stringify(css)}` - } - if (inlined) { - return `export default ${JSON.stringify(css)}` - } - return [ - `import { updateStyle, removeStyle } from ${JSON.stringify( - path.posix.join(config.base, CLIENT_PUBLIC_PATH) - )}`, - `const id = ${JSON.stringify(id)}`, - `const css = ${JSON.stringify(css)}`, - `updateStyle(id, css)`, - // css modules exports change on edit so it can't self accept - `${modulesCode || `import.meta.hot.accept()\nexport default css`}`, - `import.meta.hot.prune(() => removeStyle(id))`, - ].join('\n') - } - } - // build CSS handling ---------------------------------------------------- - - // record css - if (!inlined) { - styles.set(id, css) - } else { - css = await minifyCSS(css, config) - } - + styles.set(id, css) return { - code: modulesCode || `export default ${JSON.stringify(css)}`, + code: '', map: { mappings: '' }, // avoid the css module from being tree-shaken so that we can retrieve // it in renderChunk() - moduleSideEffects: inlined ? false : 'no-treeshake', + moduleSideEffects: 'no-treeshake', } }, - async renderChunk(code, chunk, opts) { - let chunkCSS = '' - let isPureCssChunk = true - const ids = Object.keys(chunk.modules) - for (const id of ids) { - if ( - !isCSSRequest(id) || - cssModuleRE.test(id) || - commonjsProxyRE.test(id) - ) { - isPureCssChunk = false - } - if (styles.has(id)) { - chunkCSS += styles.get(id) + async generateBundle() { + const moduleIds = Array.from(this.getModuleIds()) + const mainPath = resolveMainPathOnce(process.env.UNI_INPUT_DIR) + moduleIds.forEach((id) => { + if (id === mainPath) { + // 全局样式 + cssChunks.set('app.css', findCssModuleIds.call(this, id)) + } else if (id.includes('mpType=page')) { + // 页面样式 + cssChunks.set( + normalizeCssChunkFilename(id), + findCssModuleIds.call(this, id) + ) } + }) + if (!cssChunks.size) { + return } - - if (!chunkCSS) { - return null - } - // resolve asset URL placeholders to their built file URLs and perform // minification if necessary const processChunkCSS = async ( css: string, { + dirname, inlined, minify, }: { + dirname: string inlined: boolean minify: boolean } ) => { // replace asset url references with resolved url. - const isRelativeBase = config.base === '' || config.base.startsWith('.') css = css.replace(assetUrlRE, (_, fileHash, postfix = '') => { - const filename = getAssetFilename(fileHash, config) + postfix - registerAssetToChunk(chunk, filename) - if (!isRelativeBase || inlined) { - // absolute base or relative base but inlined (injected as style tag into - // index.html) use the base as-is - return config.base + filename - } else { - // relative base + extracted CSS - asset file will be in the same dir - return `./${path.posix.basename(filename)}` - } + return normalizePath( + path.relative(dirname, getAssetFilename(fileHash, config) + postfix) + ) }) - // only external @imports should exist at this point - and they need to - // be hoisted to the top of the CSS chunk per spec (#1845) - if (css.includes('@import')) { - css = await hoistAtImports(css) - } if (minify && config.build.minify) { css = await minifyCSS(css, config) } return css } - if (config.build.cssCodeSplit) { - if (isPureCssChunk) { - // this is a shared CSS-only chunk that is empty. - pureCssChunks.add(chunk.fileName) - } - if (opts.format === 'es' || opts.format === 'cjs') { - chunkCSS = await processChunkCSS(chunkCSS, { - inlined: false, - minify: true, - }) - // emit corresponding css file - const fileHandle = this.emitFile({ - name: chunk.name + '.css', - type: 'asset', - source: chunkCSS, - }) - chunkToEmittedCssFileMap.set( - chunk, - new Set([this.getFileName(fileHandle)]) - ) - } else if (!config.build.ssr) { - // legacy build, inline css - chunkCSS = await processChunkCSS(chunkCSS, { - inlined: true, - minify: true, - }) - const style = `__vite_style__` - const injectCode = - `var ${style} = document.createElement('style');` + - `${style}.innerHTML = ${JSON.stringify(chunkCSS)};` + - `document.head.appendChild(${style});` - if (config.build.sourcemap) { - const s = new MagicString(code) - s.prepend(injectCode) - return { - code: s.toString(), - map: s.generateMap({ hires: true }), - } - } else { - return { code: injectCode + code } - } - } - } else { - // non-split extracted CSS will be minified together - chunkCSS = await processChunkCSS(chunkCSS, { - inlined: false, - minify: false, - }) - outputToExtractedCSSMap.set( - opts, - (outputToExtractedCSSMap.get(opts) || '') + chunkCSS - ) + const genCssCode = (fileName: string) => { + return [...cssChunks.get(fileName)!] + .map((id) => styles.get(id) || '') + .join('\n') } - return null - }, - - async generateBundle(opts, bundle) { - // remove empty css chunks and their imports - if (pureCssChunks.size) { - const emptyChunkFiles = [...pureCssChunks] - .map((file) => path.basename(file)) - .join('|') - .replace(/\./g, '\\.') - const emptyChunkRE = new RegExp( - opts.format === 'es' - ? `\\bimport\\s*"[^"]*(?:${emptyChunkFiles})";\n?` - : `\\brequire\\(\\s*"[^"]*(?:${emptyChunkFiles})"\\);\n?`, - 'g' + for (const filename of cssChunks.keys()) { + let source = await processChunkCSS( + (filename === 'app.css' ? viewCssCode + '\n' : '') + + genCssCode(filename), + { dirname: path.dirname(filename), inlined: false, minify: true } ) - for (const file in bundle) { - const chunk = bundle[file] - if (chunk.type === 'chunk') { - // remove pure css chunk from other chunk's imports, - // and also register the emitted CSS files under the importer - // chunks instead. - chunk.imports = chunk.imports.filter((file) => { - if (pureCssChunks.has(file)) { - const css = chunkToEmittedCssFileMap.get( - bundle[file] as OutputChunk - ) - if (css) { - let existing = chunkToEmittedCssFileMap.get(chunk) - if (!existing) { - existing = new Set() - } - css.forEach((file) => existing!.add(file)) - chunkToEmittedCssFileMap.set(chunk, existing) - } - return false - } - return true - }) - chunk.code = chunk.code.replace( - emptyChunkRE, - // remove css import while preserving source map location - (m) => `/* empty css ${''.padEnd(m.length - 15)}*/` - ) - } - } - pureCssChunks.forEach((fileName) => { - delete bundle[fileName] - }) - } - - let extractedCss = outputToExtractedCSSMap.get(opts) - if (extractedCss && !hasEmitted) { - hasEmitted = true - // minify css - if (config.build.minify) { - extractedCss = await minifyCSS(extractedCss, config) - } this.emitFile({ - name: 'style.css', + fileName: filename, type: 'asset', - source: extractedCss, + source, }) } }, @@ -882,8 +700,8 @@ async function doUrlReplace( return `url(${wrap}${await replacer(rawUrl)}${wrap})` } -// fixed by xxxxxx -export async function minifyCSS(css: string, config: ResolvedConfig) { + +async function minifyCSS(css: string, config: ResolvedConfig) { const { code, warnings } = await transform(css, { loader: 'css', minify: true, @@ -897,14 +715,6 @@ export async function minifyCSS(css: string, config: ResolvedConfig) { return code } -// #1845 -// CSS @import can only appear at top of the file. We need to hoist all @import -// to top when multiple files are concatenated. -async function hoistAtImports(css: string) { - const postcss = await import('postcss') - return (await postcss.default([AtImportHoistPlugin]).process(css)).css -} - const AtImportHoistPlugin: Postcss.PluginCreator = () => { return { postcssPlugin: 'vite-hoist-at-imports', diff --git a/packages/uni-h5/dist/uni-h5.cjs.js b/packages/uni-h5/dist/uni-h5.cjs.js index 2ae8e8534c8f74d963b11eafe0ca0ecfe8a0ec43..97d02d1751ef57647f7488df099209aecd8ea975 100644 --- a/packages/uni-h5/dist/uni-h5.cjs.js +++ b/packages/uni-h5/dist/uni-h5.cjs.js @@ -10204,7 +10204,7 @@ function createLayoutTsx(keepAliveRoute, layoutState, windowState, topWindow, le }, 8, ["class"]); } function useShowTabBar(emit2) { - const route = vueRouter.useRoute(); + const route = usePageRoute(); const tabBar2 = useTabBar(); const showTabBar = vue.computed(() => route.meta.isTabBar && tabBar2.shown); return showTabBar; diff --git a/packages/uni-h5/dist/uni-h5.es.js b/packages/uni-h5/dist/uni-h5.es.js index efb1ab7fa6c819a3565342474e6a64f091e0c8a0..3ba8ffb32db805f3b9cfaed112eae44b2eb62921 100644 --- a/packages/uni-h5/dist/uni-h5.es.js +++ b/packages/uni-h5/dist/uni-h5.es.js @@ -18828,7 +18828,7 @@ function createLayoutTsx(keepAliveRoute, layoutState, windowState, topWindow, le }, 8, ["class"]); } function useShowTabBar(emit2) { - const route = useRoute(); + const route = usePageRoute(); const tabBar2 = useTabBar(); const showTabBar2 = computed(() => route.meta.isTabBar && tabBar2.shown); updateCssVar({ diff --git a/packages/uni-h5/src/framework/components/layout/index.tsx b/packages/uni-h5/src/framework/components/layout/index.tsx index afba957d684680f7168a18eb340bbefeaad38cc5..603b776fee2c6a3ab8d7ee004b5938ab2c1765e4 100644 --- a/packages/uni-h5/src/framework/components/layout/index.tsx +++ b/packages/uni-h5/src/framework/components/layout/index.tsx @@ -18,7 +18,7 @@ import { nextTick, } from 'vue' -import { RouterView, useRoute } from 'vue-router' +import { RouterView } from 'vue-router' import { defineSystemComponent } from '@dcloudio/uni-components' import { updateCssVar } from '@dcloudio/uni-core' @@ -334,7 +334,7 @@ function createLayoutTsx( } function useShowTabBar(emit: SetupContext<['change']>['emit']) { - const route = useRoute() + const route = usePageRoute() const tabBar = useTabBar()! // TODO meida query const showTabBar = computed(() => route.meta.isTabBar && tabBar.shown) diff --git a/packages/vite-plugin-uni/src/cli/nvue.ts b/packages/vite-plugin-uni/src/cli/nvue.ts index 350bbdb43995c7b3ac18dc4d6d5683e7b8a5b62e..974ee6c176dabcd64df68656287b838c11ac62e6 100644 --- a/packages/vite-plugin-uni/src/cli/nvue.ts +++ b/packages/vite-plugin-uni/src/cli/nvue.ts @@ -1,13 +1,14 @@ import { parseManifestJsonOnce, - getRenderer, + getAppRenderer, + getAppCodeSpliting, getNVueCompiler, getNVueStyleCompiler, } from '@dcloudio/uni-cli-shared' export function initNVueEnv() { const manifestJson = parseManifestJsonOnce(process.env.UNI_INPUT_DIR) - if (getRenderer(manifestJson) === 'native') { + if (getAppRenderer(manifestJson) === 'native') { process.env.UNI_RENDERER = 'native' } const nvueCompiler = getNVueCompiler(manifestJson) @@ -19,4 +20,7 @@ export function initNVueEnv() { if (getNVueStyleCompiler(manifestJson) === 'uni-app') { process.env.UNI_NVUE_STYLE_COMPILER = 'uni-app' } + if (getAppCodeSpliting(manifestJson)) { + process.env.UNI_APP_CODE_SPLITING = 'true' + } }