From 2f978ad75cfa1460359d577bc4c1cc3555dccbac Mon Sep 17 00:00:00 2001 From: zoy-l <409626581@qq.com> Date: Wed, 19 Jan 2022 15:48:19 +0800 Subject: [PATCH] fix(vant-cli): pnpm compatibility (#10214) * fix(vant-cli): pnpm compatibility * chore: clean code, semantic naming --- packages/vant-cli/src/common/constant.ts | 6 +- .../vant-cli/src/compiler/compile-site.ts | 15 +---- .../src/compiler/gen-package-style.ts | 10 ++- .../src/compiler/gen-site-desktop-shared.ts | 4 +- .../src/compiler/gen-site-mobile-shared.ts | 7 +-- packages/vant-cli/src/config/vite.site.ts | 61 ++++++++++++++----- 6 files changed, 62 insertions(+), 41 deletions(-) diff --git a/packages/vant-cli/src/common/constant.ts b/packages/vant-cli/src/common/constant.ts index 229177a08..ff9f7ec8e 100644 --- a/packages/vant-cli/src/common/constant.ts +++ b/packages/vant-cli/src/common/constant.ts @@ -36,11 +36,7 @@ export const SITE_SRC_DIR = join(__dirname, '..', '..', 'site'); // Dist files export const PACKAGE_ENTRY_FILE = join(DIST_DIR, 'package-entry.js'); export const PACKAGE_STYLE_FILE = join(DIST_DIR, 'package-style.css'); -export const SITE_MOBILE_SHARED_FILE = join(DIST_DIR, 'site-mobile-shared.js'); -export const SITE_DESKTOP_SHARED_FILE = join( - DIST_DIR, - 'site-desktop-shared.js' -); + export const STYLE_DEPS_JSON_FILE = join(DIST_DIR, 'style-deps.json'); // Config files diff --git a/packages/vant-cli/src/compiler/compile-site.ts b/packages/vant-cli/src/compiler/compile-site.ts index 151d1827f..5e58c30da 100644 --- a/packages/vant-cli/src/compiler/compile-site.ts +++ b/packages/vant-cli/src/compiler/compile-site.ts @@ -5,27 +5,18 @@ import { getViteConfigForSiteDev, getViteConfigForSiteProd, } from '../config/vite.site.js'; -import { mergeCustomViteConfig, replaceExt } from '../common/index.js'; -import { CSS_LANG } from '../common/css.js'; +import { mergeCustomViteConfig } from '../common/index.js'; import { genPackageEntry } from './gen-package-entry.js'; -import { genPackageStyle } from './gen-package-style.js'; -import { genSiteMobileShared } from './gen-site-mobile-shared.js'; -import { genSiteDesktopShared } from './gen-site-desktop-shared.js'; import { genStyleDepsMap } from './gen-style-deps-map.js'; -import { PACKAGE_ENTRY_FILE, PACKAGE_STYLE_FILE } from '../common/constant.js'; +import { PACKAGE_ENTRY_FILE } from '../common/constant.js'; -export async function genSiteEntry(): Promise { +export function genSiteEntry(): Promise { return new Promise((resolve, reject) => { genStyleDepsMap() .then(() => { genPackageEntry({ outputPath: PACKAGE_ENTRY_FILE, }); - genPackageStyle({ - outputPath: replaceExt(PACKAGE_STYLE_FILE, `.${CSS_LANG}`), - }); - genSiteMobileShared(); - genSiteDesktopShared(); resolve(); }) .catch((err) => { diff --git a/packages/vant-cli/src/compiler/gen-package-style.ts b/packages/vant-cli/src/compiler/gen-package-style.ts index 1f0b0426c..fdb62612e 100644 --- a/packages/vant-cli/src/compiler/gen-package-style.ts +++ b/packages/vant-cli/src/compiler/gen-package-style.ts @@ -6,11 +6,11 @@ import { CSS_LANG, getCssBaseFile } from '../common/css.js'; import { SRC_DIR, STYLE_DEPS_JSON_FILE } from '../common/constant.js'; type Options = { - outputPath: string; + outputPath?: string; pathResolver?: (path: string) => string; }; -export function genPackageStyle(options: Options) { +export function genPackageStyle(options: Options = {}) { const require = createRequire(import.meta.url); const styleDepsJson = require(STYLE_DEPS_JSON_FILE); const ext = '.' + CSS_LANG; @@ -43,5 +43,9 @@ export function genPackageStyle(options: Options) { .filter((item: string) => !!item) .join('\n'); - smartOutputFile(options.outputPath, content); + if (options.outputPath) { + smartOutputFile(options.outputPath, content); + } else { + return content; + } } diff --git a/packages/vant-cli/src/compiler/gen-site-desktop-shared.ts b/packages/vant-cli/src/compiler/gen-site-desktop-shared.ts index 11f1c370b..c37375639 100644 --- a/packages/vant-cli/src/compiler/gen-site-desktop-shared.ts +++ b/packages/vant-cli/src/compiler/gen-site-desktop-shared.ts @@ -5,7 +5,6 @@ import { isDev, pascalize, getVantConfig, - smartOutputFile, normalizePath, } from '../common/index.js'; import { @@ -13,7 +12,6 @@ import { DOCS_DIR, getPackageJson, VANT_CONFIG_FILE, - SITE_DESKTOP_SHARED_FILE, } from '../common/constant.js'; type DocumentItem = { @@ -122,5 +120,5 @@ ${genExportDocuments(documents)} ${genExportVersion()} `; - smartOutputFile(SITE_DESKTOP_SHARED_FILE, code); + return code; } diff --git a/packages/vant-cli/src/compiler/gen-site-mobile-shared.ts b/packages/vant-cli/src/compiler/gen-site-mobile-shared.ts index 9ab63362b..c6a9bf874 100644 --- a/packages/vant-cli/src/compiler/gen-site-mobile-shared.ts +++ b/packages/vant-cli/src/compiler/gen-site-mobile-shared.ts @@ -1,12 +1,11 @@ import { join } from 'path'; import { existsSync, readdirSync } from 'fs'; -import { SRC_DIR, SITE_MOBILE_SHARED_FILE } from '../common/constant.js'; +import { SRC_DIR } from '../common/constant.js'; import { pascalize, removeExt, decamelize, getVantConfig, - smartOutputFile, normalizePath, } from '../common/index.js'; import { CSS_LANG } from '../common/css.js'; @@ -68,7 +67,7 @@ function genCode(components: string[]) { })) .filter((item) => existsSync(item.path)); - return `import './package-style.${CSS_LANG}'; + return `import 'package-style.${CSS_LANG}'; ${genImports(demos)} ${genExports(demos)} @@ -80,5 +79,5 @@ export function genSiteMobileShared() { const dirs = readdirSync(SRC_DIR); const code = genCode(dirs); - smartOutputFile(SITE_MOBILE_SHARED_FILE, code); + return code; } diff --git a/packages/vant-cli/src/config/vite.site.ts b/packages/vant-cli/src/config/vite.site.ts index f883904ed..f3921ac4d 100644 --- a/packages/vant-cli/src/config/vite.site.ts +++ b/packages/vant-cli/src/config/vite.site.ts @@ -5,15 +5,14 @@ import vitePluginMd from 'vite-plugin-md'; import vitePluginVue from '@vitejs/plugin-vue'; import vitePluginJsx from '@vitejs/plugin-vue-jsx'; import { setBuildTarget, getVantConfig, isDev } from '../common/index.js'; -import { - SITE_DIST_DIR, - SITE_MOBILE_SHARED_FILE, - SITE_DESKTOP_SHARED_FILE, - SITE_SRC_DIR, -} from '../common/constant.js'; +import { SITE_DIST_DIR, SITE_SRC_DIR } from '../common/constant.js'; import { injectHtml } from 'vite-plugin-html'; -import type { InlineConfig } from 'vite'; +import type { InlineConfig, PluginOption } from 'vite'; import type MarkdownIt from 'markdown-it'; +import { genSiteMobileShared } from '../compiler/gen-site-mobile-shared.js'; +import { genSiteDesktopShared } from '../compiler/gen-site-desktop-shared.js'; +import { genPackageStyle } from '../compiler/gen-package-style.js'; +import { CSS_LANG } from '../common/css.js'; function markdownHighlight(str: string, lang: string) { if (lang && hljs.getLanguage(lang)) { @@ -92,6 +91,46 @@ function getHTMLMeta(vantConfig: any) { return ''; } +function vitePluginGenVantBaseCode(): PluginOption { + const virtualMobileModuleId = 'site-mobile-shared'; + const resolvedMobileVirtualModuleId = `vant-cli:${virtualMobileModuleId}`; + + const virtualDesktopModuleId = 'site-desktop-shared'; + const resolvedDesktopVirtualModuleId = `vant-cli:${virtualDesktopModuleId}`; + + const virtualPackageStyleModuleId = /package-style/; + const resolvedPackageStyleVirtualModuleId = `vant-cli${virtualPackageStyleModuleId}index.${CSS_LANG}`; + + return { + name: 'vite-plugin(vant-cli):gen-site-base-code', + resolveId(id) { + if (id === virtualMobileModuleId) { + return resolvedMobileVirtualModuleId; + } + + if (id === virtualDesktopModuleId) { + return resolvedDesktopVirtualModuleId; + } + + if (virtualPackageStyleModuleId.test(id)) { + return resolvedPackageStyleVirtualModuleId; + } + }, + load(id) { + switch (id) { + case resolvedMobileVirtualModuleId: + return genSiteMobileShared(); + case resolvedDesktopVirtualModuleId: + return genSiteDesktopShared(); + case resolvedPackageStyleVirtualModuleId: + return genPackageStyle(); + default: + break; + } + }, + }; +} + export function getViteConfigForSiteDev(): InlineConfig { setBuildTarget('site'); @@ -105,6 +144,7 @@ export function getViteConfigForSiteDev(): InlineConfig { root: SITE_SRC_DIR, plugins: [ + vitePluginGenVantBaseCode(), vitePluginVue({ include: [/\.vue$/, /\.md$/], }), @@ -145,13 +185,6 @@ export function getViteConfigForSiteDev(): InlineConfig { }), ], - resolve: { - alias: { - 'site-mobile-shared': SITE_MOBILE_SHARED_FILE, - 'site-desktop-shared': SITE_DESKTOP_SHARED_FILE, - }, - }, - server: { host: '0.0.0.0', },