diff --git a/CHANGELOG.md b/CHANGELOG.md index 2b4230c50..58d847a7c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,12 @@ ## Changelog +## 3.8.7 + +- Fix: SPA SSR `getInitialProps` is invalid +- Feat: miniapp webview mode should modify app to MPA type +- Chore: add ssr test case +- Chore: remove DEF comment node + ## 3.8.6 - Fix: page component import method in the env other than web diff --git a/__tests__/build-cases/basic-spa-ssr.test.ts b/__tests__/build-cases/basic-spa-ssr.test.ts new file mode 100644 index 000000000..add04bcd9 --- /dev/null +++ b/__tests__/build-cases/basic-spa-ssr.test.ts @@ -0,0 +1,30 @@ +import * as path from 'path'; +import * as cheerio from 'cheerio'; +import { buildFixture } from '../utils/build'; + +const example = 'basic-spa-ssr'; +const BUNDLE_URL = require.resolve(path.join(process.cwd(), `examples/${example}/build/node/index.js`)); + +describe('should build web result: ', () => { + buildFixture(example); + + test('ssr render method', async () => { + const { render } = require(BUNDLE_URL); + const ctxReq = { + url: '/?a=1', + path: '/', + }; + + let html; + const ctxRes = { + setHeader() {}, + send(result) { + html = result; + }, + }; + const ctx = { req: ctxReq, res: ctxRes }; + await render(ctx); + const $ = cheerio.load(html, { decodeEntities: false }); + expect($('.title').text()).toBe('Welcome to Your Rax App with SSR'); + }); +}); diff --git a/examples/basic-spa-ssr/build.json b/examples/basic-spa-ssr/build.json index 53e1d57a1..5c8a1cb53 100644 --- a/examples/basic-spa-ssr/build.json +++ b/examples/basic-spa-ssr/build.json @@ -2,6 +2,5 @@ "targets": ["web"], "web": { "ssr": true - }, - "swc": true + } } diff --git a/package.json b/package.json index b298c5910..45ec80799 100644 --- a/package.json +++ b/package.json @@ -70,7 +70,8 @@ "simple-git": "^1.132.0", "ts-jest": "^25.4.0", "ts-node": "^8.6.1", - "typescript": "^3.7.4" + "typescript": "^4.0.0", + "cheerio": "1.0.0-rc.3" }, "dependencies": { "core-js": "^3.6.4", diff --git a/packages/babel-plugin-transform-jsx-to-html/src/index.js b/packages/babel-plugin-transform-jsx-to-html/src/index.js index f46a7e070..b8eb36081 100644 --- a/packages/babel-plugin-transform-jsx-to-html/src/index.js +++ b/packages/babel-plugin-transform-jsx-to-html/src/index.js @@ -29,7 +29,7 @@ module.exports = function () { const result = []; - let html = `<${ tagName}`; + let html = `<${tagName}`; let attrs = openingPath.node.attributes; if (attrs.length) { @@ -68,7 +68,7 @@ module.exports = function () { } if (path.node.closingElement || innerHTML) { - pushResult(t.stringLiteral(``), result); + pushResult(t.stringLiteral(``), result); } if (result && result.length) { @@ -197,7 +197,7 @@ function buildOpeningElementAttributes(attribs, file) { name = 'class'; } const value = prop.value.value.replace(/\n\s+/g, ' '); - staticAttrs = `${staticAttrs } ${ name }="${ value }"`; + staticAttrs = `${staticAttrs} ${name}="${value}"`; } else { _props.push(convertAttribute(prop)); } @@ -260,7 +260,7 @@ function convertAttribute(node) { if (t.isJSXNamespacedName(node.name)) { node.name = t.stringLiteral( - `${node.name.namespace.name }:${ node.name.name.name}`, + `${node.name.namespace.name}:${node.name.name.name}`, ); } else if (esutils.keyword.isIdentifierNameES6(node.name.name)) { node.name.type = 'Identifier'; diff --git a/packages/exports-field-webpack-plugin/src/createResolverPlugin.ts b/packages/exports-field-webpack-plugin/src/createResolverPlugin.ts index 598ffada4..82e4b7d1f 100644 --- a/packages/exports-field-webpack-plugin/src/createResolverPlugin.ts +++ b/packages/exports-field-webpack-plugin/src/createResolverPlugin.ts @@ -93,7 +93,7 @@ export default function (resolver, hook, conditionNames) { fragment, }; - resolver.doResolve(hook, obj, `using exports field: ${ p}`, resolveContext, forEachCallback); + resolver.doResolve(hook, obj, `using exports field: ${p}`, resolveContext, forEachCallback); }, (err, result) => callback(err, result || null), ); diff --git a/packages/plugin-rax-app/CHANGELOG.md b/packages/plugin-rax-app/CHANGELOG.md index acfb847e0..9fb98e6fd 100644 --- a/packages/plugin-rax-app/CHANGELOG.md +++ b/packages/plugin-rax-app/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +## 7.0.4 + +- Fix: Remove error message when using mpa mode with webview miniapp + ## 7.0.3 - Fix: page component import method in the env other than web diff --git a/packages/plugin-rax-app/package.json b/packages/plugin-rax-app/package.json index a40e78a93..3e8cbc805 100644 --- a/packages/plugin-rax-app/package.json +++ b/packages/plugin-rax-app/package.json @@ -1,6 +1,6 @@ { "name": "build-plugin-rax-app", - "version": "7.0.3", + "version": "7.0.4", "description": "The basic webpack configuration for rax project", "author": "Rax Team", "main": "lib/index.js", diff --git a/packages/plugin-rax-app/src/userConfig/modify.ts b/packages/plugin-rax-app/src/userConfig/modify.ts index 77b7b2a41..8234ec202 100644 --- a/packages/plugin-rax-app/src/userConfig/modify.ts +++ b/packages/plugin-rax-app/src/userConfig/modify.ts @@ -59,7 +59,7 @@ export default (api) => { } // Unify all targets mpa config - const hasMPA = newUserConfig.targets.some((target) => newUserConfig[target] && newUserConfig[target].mpa); + const hasMPA = newUserConfig.targets.some((target) => newUserConfig[target] && (newUserConfig[target].mpa || newUserConfig[target].buildType === 'webview')); if (hasMPA) { newUserConfig.targets // Avoid miniapp runtime mode be became MPA @@ -78,7 +78,7 @@ export default (api) => { // Warning tip when use miniapp runtime mode with MPA for (const target of newUserConfig.targets) { - if (MINIAPP_PLATFORMS.includes(target) && !newUserConfig[target]?.subpackages) { + if (MINIAPP_PLATFORMS.includes(target) && !newUserConfig[target]?.subpackages && newUserConfig[target]?.buildType !== 'webview') { log.error('小程序非分包模式不推荐和 MPA 应用同时使用,下一个大版本将禁止该能力!'); } } diff --git a/packages/plugin-rax-web/CHANGELOG.md b/packages/plugin-rax-web/CHANGELOG.md index 2f54f50a9..6f703219d 100644 --- a/packages/plugin-rax-web/CHANGELOG.md +++ b/packages/plugin-rax-web/CHANGELOG.md @@ -1,5 +1,10 @@ # Changelog +## v2.0.4 + +- Fix: not filter routes by target in document plugin +- Fix: DEF remove comment node check + ## v2.0.3 - Chore: add logic protect diff --git a/packages/plugin-rax-web/package.json b/packages/plugin-rax-web/package.json index 11aeff61d..06cc98e6d 100644 --- a/packages/plugin-rax-web/package.json +++ b/packages/plugin-rax-web/package.json @@ -1,6 +1,6 @@ { "name": "build-plugin-rax-web", - "version": "2.0.3", + "version": "2.0.4", "description": "rax web app plugin", "main": "lib/index.js", "scripts": { @@ -37,4 +37,4 @@ "devDependencies": { "webpack": ">=4.0.0" } -} +} \ No newline at end of file diff --git a/packages/plugin-rax-web/src/Plugins/DocumentPlugin.ts b/packages/plugin-rax-web/src/Plugins/DocumentPlugin.ts index 431750fe2..99e79fd45 100644 --- a/packages/plugin-rax-web/src/Plugins/DocumentPlugin.ts +++ b/packages/plugin-rax-web/src/Plugins/DocumentPlugin.ts @@ -1,6 +1,6 @@ import * as path from 'path'; import * as Module from 'module'; -import * as cheerio from 'cheerio'; +import { load } from 'cheerio'; import * as htmlparser2 from 'htmlparser2'; import { getEntriesByRoute } from '@builder/app-helpers'; import { registerListenTask, getAssets, getEnableStatus, updateEnableStatus } from '../utils/localBuildCache'; @@ -31,6 +31,7 @@ export default class DocumentPlugin { }, documentPath, insertScript, + target, } = this.options; const { mpa, doctype = '', ssr, staticExport } = webConfig || {}; // DEF plugin will pass publicPath override compiler publicPath in Weex Type App @@ -65,6 +66,7 @@ export default class DocumentPlugin { entryName, mpa, rootDir, + target, }); let html = ''; // PHA will consume document field @@ -84,7 +86,7 @@ export default class DocumentPlugin { } const parserOptions = { decodeEntities: false }; - const $ = cheerio.load(htmlparser2.parseDOM(html, parserOptions), parserOptions); + const $ = load(htmlparser2.parseDOM(html, parserOptions), parserOptions); if (injectedHTML.comboScripts.length) { // Insert comboed script $('#root').after([genComboedScript(injectedHTML.comboScripts), ...injectedHTML.scripts]); @@ -132,9 +134,15 @@ export default class DocumentPlugin { } } -function getTitleByStaticConfig(staticConfig, { entryName, mpa, rootDir }): string { +function getTitleByStaticConfig(staticConfig, { entryName, mpa, rootDir, target }): string { if (!mpa) return staticConfig.window?.title; const route = staticConfig.routes + .filter((r) => { + if (Array.isArray(r.targets) && !r.targets.includes(target)) { + return false; + } + return true; + }) .reduce((prev, curr) => { return [...prev, ...getEntriesByRoute(curr, rootDir)]; }, []) diff --git a/packages/plugin-rax-web/src/index.ts b/packages/plugin-rax-web/src/index.ts index e4941557e..76fde1860 100644 --- a/packages/plugin-rax-web/src/index.ts +++ b/packages/plugin-rax-web/src/index.ts @@ -14,7 +14,7 @@ import getAppEntry from './utils/getAppEntry'; const { getMpaEntries } = appHelpers; export default (api) => { - const { onGetWebpackConfig, getValue, context, registerTask, registerCliOption, applyMethod, onHook } = api; + const { onGetWebpackConfig, getValue, context, registerTask, registerCliOption, applyMethod } = api; const getWebpackBase = getValue(GET_RAX_APP_WEBPACK_CONFIG); const tempDir = getValue('TEMP_PATH'); @@ -45,9 +45,6 @@ export default (api) => { } }); - // Web entries - let entries = [getAppEntry(rootDir)]; - onGetWebpackConfig(target, (config) => { // eslint-disable-next-line @typescript-eslint/no-shadow const { command } = context; @@ -58,7 +55,8 @@ export default (api) => { api, staticConfig, documentPath, - pages: webConfig.mpa ? [] : entries, + pages: webConfig.mpa ? [] : [getAppEntry(rootDir)], + target, }, ]); if (webConfig.snapshot) { @@ -70,10 +68,6 @@ export default (api) => { } if (webConfig.mpa || webConfig.pha) { - entries = getMpaEntries(api, { - target, - appJsonContent: staticConfig, - }); // support --mpa-entry to specify mpa entry registerCliOption({ name: 'mpa-entry', @@ -83,7 +77,10 @@ export default (api) => { type: 'web', framework: 'rax', targetDir: tempDir, - entries, + entries: getMpaEntries(api, { + target, + appJsonContent: staticConfig, + }), }); } @@ -101,24 +98,6 @@ export default (api) => { } setLocalBuilder(api); } - - // Remove comment node - let webBuildDir; - - onHook('before.build.run', ({ config: configs }) => { - const config = configs.find((configItem) => configItem.name === 'web'); - webBuildDir = config.output.path; - }); - - onHook('after.build.compile', () => { - entries.forEach(({ entryName }) => { - const htmlFilePath = path.join(webBuildDir, `${entryName}.html`); - if (fs.existsSync(htmlFilePath)) { - const html = fs.readFileSync(htmlFilePath, 'utf-8'); - fs.writeFileSync(htmlFilePath, html.replace(/(\<\!--__INNER_ROOT__--\>|\<\!--__BEFORE_ROOT__--\>|\<\!--__AFTER_ROOT__--\>)/g, '')); - } - }); - }); }; function getAbsolutePath(filepath: string): string | undefined { diff --git a/packages/plugin-rax-web/src/utils/htmlStructure.ts b/packages/plugin-rax-web/src/utils/htmlStructure.ts index a5eb7e551..18b6e6f4b 100644 --- a/packages/plugin-rax-web/src/utils/htmlStructure.ts +++ b/packages/plugin-rax-web/src/utils/htmlStructure.ts @@ -74,10 +74,10 @@ export function getBuiltInHtmlTpl(htmlInfo: IHtmlInfo, ssr: boolean) { ${addLinksBySource(assetLinks)} - ${ ssr ? '' : '' } + ${ssr ? '' : ''}
${initialHTML}
${addStaticSource(customComboScripts.length ? [genComboedScript(customComboScripts), ...customScripts] : customScripts)} - ${ ssr ? '' : '' } + ${ssr ? '' : ''} ${addScriptsBySource(assetScripts)} diff --git a/packages/plugin-ssr/CHANGELOG.md b/packages/plugin-ssr/CHANGELOG.md index 681b6c53b..8af9a2314 100644 --- a/packages/plugin-ssr/CHANGELOG.md +++ b/packages/plugin-ssr/CHANGELOG.md @@ -1,5 +1,9 @@ # Changelog +## v2.0.6 + +- Fix: SPA SSR `getInitialProps` is invalid + ## v2.0.5 - Fix: MPA runApp file path diff --git a/packages/plugin-ssr/package.json b/packages/plugin-ssr/package.json index b70c27597..4ba429f37 100644 --- a/packages/plugin-ssr/package.json +++ b/packages/plugin-ssr/package.json @@ -1,6 +1,6 @@ { "name": "build-plugin-ssr", - "version": "2.0.5", + "version": "2.0.6", "description": "", "author": "", "homepage": "https://github.com/alibaba/ice#readme", diff --git a/packages/plugin-ssr/src/ssr/EntryLoader.ts b/packages/plugin-ssr/src/ssr/EntryLoader.ts index 038dc5ec3..14cb5094b 100644 --- a/packages/plugin-ssr/src/ssr/EntryLoader.ts +++ b/packages/plugin-ssr/src/ssr/EntryLoader.ts @@ -22,7 +22,7 @@ function addDefineInitialPage() { let Page; if (enableRouter) { const route = staticConfig.routes.find(({ path }) => path === pathname); - Page = route.component; + Page = route.component(); } else { Page = appConfig.app && appConfig.app.renderComponent; } diff --git a/packages/rax-app/package.json b/packages/rax-app/package.json index 6bae7eb83..bd68dfc3e 100644 --- a/packages/rax-app/package.json +++ b/packages/rax-app/package.json @@ -1,6 +1,6 @@ { "name": "rax-app", - "version": "3.8.6", + "version": "3.8.7", "description": "command line interface and builtin plugin for rax app", "author": "Rax Team", "homepage": "https://github.com/alibaba/ice#readme", @@ -18,14 +18,14 @@ "build-scripts": "^1.1.0", "build-plugin-app-core": "2.1.0", "build-plugin-ice-config": "2.0.2", - "build-plugin-rax-app": "7.0.3", + "build-plugin-rax-app": "7.0.4", "build-plugin-rax-kraken": "2.0.0", "build-plugin-rax-miniapp": "2.0.0", "build-plugin-rax-pha": "2.0.0", "build-plugin-rax-store": "2.0.0", - "build-plugin-rax-web": "2.0.3", + "build-plugin-rax-web": "2.0.4", "build-plugin-rax-weex": "2.0.0", - "build-plugin-ssr": "2.0.5", + "build-plugin-ssr": "2.0.6", "build-plugin-rax-router": "1.0.3", "build-plugin-ice-logger": "2.0.0", "build-plugin-minify-classname": "0.2.0", diff --git a/packages/stylesheet-loader/src/globalCSSVariable.ts b/packages/stylesheet-loader/src/globalCSSVariable.ts index 3affe15f8..b84b85056 100644 --- a/packages/stylesheet-loader/src/globalCSSVariable.ts +++ b/packages/stylesheet-loader/src/globalCSSVariable.ts @@ -17,7 +17,7 @@ export default function getGlobalCSSVariable(config) { } else { styleValue = styles[key][name]; } - globalCSSVariable += `__globalObject.__RootCSSVariable["${ name }"] = "${ styleValue }";`; + globalCSSVariable += `__globalObject.__RootCSSVariable["${name}"] = "${styleValue}";`; } } } diff --git a/packages/stylesheet-loader/src/particular.ts b/packages/stylesheet-loader/src/particular.ts index 704dd4c80..6e8a5faf5 100644 --- a/packages/stylesheet-loader/src/particular.ts +++ b/packages/stylesheet-loader/src/particular.ts @@ -32,10 +32,10 @@ function measure(value, key) { } } - const topKey = `${key }Top`; - const rightKey = `${key }Right`; - const bottomKey = `${key }Bottom`; - const leftKey = `${key }Left`; + const topKey = `${key}Top`; + const rightKey = `${key}Right`; + const bottomKey = `${key}Bottom`; + const leftKey = `${key}Left`; const result = { isDeleted: true, @@ -54,22 +54,22 @@ const border = function (key, value) { }; const direction = value && value.split(' '); - result[`${key }Width`] = direction && convertUnit(direction[0]); - result[`${key }Style`] = direction && direction[1]; - result[`${key }Color`] = direction && normalizeColor(direction[2]); + result[`${key}Width`] = direction && convertUnit(direction[0]); + result[`${key}Style`] = direction && direction[1]; + result[`${key}Color`] = direction && normalizeColor(direction[2]); return result; }; const toMs = function (value) { if (typeof value === 'string') { - if (/^\./.test(value)) value = `0${ value}`; // .5s + if (/^\./.test(value)) value = `0${value}`; // .5s if (/s$/.test(value) && !/ms$/.test(value)) { // 1.5s value = parseFloat(value) * 1000; } else { // 150 or 150ms value = parseFloat(value); } } - return `${value || 0 }ms`; + return `${value || 0}ms`; }; const transitionProperty = function (value) { diff --git a/packages/stylesheet-loader/src/transformer.ts b/packages/stylesheet-loader/src/transformer.ts index ab4d6ad0b..715081fbb 100644 --- a/packages/stylesheet-loader/src/transformer.ts +++ b/packages/stylesheet-loader/src/transformer.ts @@ -13,7 +13,7 @@ export default { sanitizeSelector(selector, transformDescendantCombinator = false, position = { start: { line: 0, column: 0 } }, log = false) { // tag selector suffix @ if (/^[a-zA-Z]/.test(selector)) { - selector = `@${ selector}`; + selector = `@${selector}`; } // filter multiple extend selectors if (log && !transformDescendantCombinator && !/^[.|@|#][a-zA-Z0-9_:\-]+$/.test(selector)) {