From 65d0361a1eaf65455d2e205851ce73af29dcc76f Mon Sep 17 00:00:00 2001 From: juvham Date: Thu, 26 Nov 2020 20:58:11 +0800 Subject: [PATCH 1/7] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=8D=95=E9=A1=B5?= =?UTF-8?q?=E5=BA=94=E7=94=A8=E8=BF=9B=E9=A6=96=E9=A1=B5=E4=BC=9A=E5=8A=A0?= =?UTF-8?q?=E8=BD=BD=E5=85=A8=E9=83=A8=E8=B5=84=E6=BA=90=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/remax-cli/src/build/entries/SpaEntry.ts | 10 +++++++++- packages/remax-web/src/createApp.tsx | 4 ++-- packages/remax-web/src/types/index.ts | 2 +- 3 files changed, 12 insertions(+), 4 deletions(-) diff --git a/packages/remax-cli/src/build/entries/SpaEntry.ts b/packages/remax-cli/src/build/entries/SpaEntry.ts index 3502c536f..af68e1b8b 100644 --- a/packages/remax-cli/src/build/entries/SpaEntry.ts +++ b/packages/remax-cli/src/build/entries/SpaEntry.ts @@ -27,7 +27,15 @@ export default class SpaEntry extends VirtualEntry { )}, pageComponents: [ ${Array.from(this.builder.entryCollection.entries.values()) - .map(entry => `import(/* webpackChunkName: "${entry.name}" */'${entry.filename}')`) + .map( + entry => `function() { + return import( + /* webpackPrefetch: true */ + /* webpackChunkName: "${entry.name}" */ + '${entry.filename}' + ) +` + ) .join(',')} ], plugins: [ diff --git a/packages/remax-web/src/createApp.tsx b/packages/remax-web/src/createApp.tsx index b73ab73f5..707aa2707 100644 --- a/packages/remax-web/src/createApp.tsx +++ b/packages/remax-web/src/createApp.tsx @@ -28,11 +28,11 @@ export default function createApp(options: BootstrapOptions, history: History) { {(props: any) => { const pageComponent = async ? loadable(() => - (pageComponents[i] as Promise<{ default: React.ComponentType }>).then(({ default: c }) => + (pageComponents[i]() as Promise<{ default: React.ComponentType }>).then(({ default: c }) => createPageConfig(c, page.route) ) ) - : createPageConfig(pageComponents[i] as React.ComponentType, page.route); + : createPageConfig(pageComponents[i]() as React.ComponentType, page.route); return React.createElement(pageComponent, { ...props, pageConfig: { diff --git a/packages/remax-web/src/types/index.ts b/packages/remax-web/src/types/index.ts index 611932330..f5ceaa4af 100644 --- a/packages/remax-web/src/types/index.ts +++ b/packages/remax-web/src/types/index.ts @@ -13,7 +13,7 @@ export interface BootstrapOptions { appComponent: React.ComponentType; appConfig: AppConfig; plugins?: any[]; - pageComponents: Array | React.ComponentType>; + pageComponents: Array<() => Promise<{ default: React.ComponentType }> | React.ComponentType>; pages: Page[]; } From 3a744e8c7607f19a87d3a36cf9ce2b425c86c595 Mon Sep 17 00:00:00 2001 From: juvham Date: Thu, 26 Nov 2020 21:27:51 +0800 Subject: [PATCH 2/7] =?UTF-8?q?fix:=20=E4=BF=AE=E6=94=B9=E6=B5=8B=E8=AF=95?= =?UTF-8?q?=E9=A1=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/remax-web/src/__tests__/createApp.test.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/packages/remax-web/src/__tests__/createApp.test.tsx b/packages/remax-web/src/__tests__/createApp.test.tsx index 46ca5985e..1691108ab 100644 --- a/packages/remax-web/src/__tests__/createApp.test.tsx +++ b/packages/remax-web/src/__tests__/createApp.test.tsx @@ -20,7 +20,7 @@ describe('createApp', () => { appConfig: { pages: ['pages/foo'], }, - pageComponents: [createPage('foo'), createPage('bar')], + pageComponents: [() => createPage('foo'), () => createPage('bar')], pages: [ { route: 'pages/foo', @@ -51,7 +51,7 @@ describe('createApp', () => { defaultTitle: 'remax', }, }, - pageComponents: [createPage('index')], + pageComponents: [() => createPage('index')], pages: [ { route: 'pages/index', @@ -77,7 +77,7 @@ describe('createApp', () => { defaultTitle: 'remax', }, }, - pageComponents: [createPage('index')], + pageComponents: [() => createPage('index')], pages: [ { route: 'pages/index', @@ -120,7 +120,7 @@ describe('createApp', () => { ], }, }, - pageComponents: [createPage('foo'), createPage('bar')], + pageComponents: [() => createPage('foo'), () => createPage('bar')], pages: [ { route: 'pages/foo', @@ -149,7 +149,7 @@ describe('createApp', () => { appConfig: { pages: ['pages/index'], }, - pageComponents: [createPage('index')], + pageComponents: [() => createPage('index')], pages: [ { route: 'pages/index', From df0957ea8a3d829db09c84b1909558dc0fb1f8df Mon Sep 17 00:00:00 2001 From: juvham Date: Thu, 26 Nov 2020 21:29:28 +0800 Subject: [PATCH 3/7] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dpublic/index.html?= =?UTF-8?q?=E6=97=A0=E6=95=88=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/remax-cli/src/build/webpack/config.web.mpa.ts | 5 ++++- packages/remax-cli/src/build/webpack/config.web.ts | 5 ++++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/remax-cli/src/build/webpack/config.web.mpa.ts b/packages/remax-cli/src/build/webpack/config.web.mpa.ts index f75c6830c..2f7ec8662 100644 --- a/packages/remax-cli/src/build/webpack/config.web.mpa.ts +++ b/packages/remax-cli/src/build/webpack/config.web.mpa.ts @@ -1,4 +1,5 @@ import * as path from 'path'; +import * as fs from 'fs'; import * as webpack from 'webpack'; import Config from 'webpack-chain'; import HtmlWebpackPlugin from 'html-webpack-plugin'; @@ -20,7 +21,9 @@ export default function webpackConfig(builder: Builder): webpack.Configuration { { filename: entry.name + '.html', chunks: [entry.name], - template: path.resolve(__dirname, '../../../template/index.html.ejs'), + template: fs.existsSync(path.join(builder.projectPath.publicDir(), '/index.html')) + ? path.join(builder.projectPath.publicDir(), '/index.html') + : path.resolve(__dirname, '../../../template/index.html.ejs'), env: process.env.NODE_ENV, }, ]); diff --git a/packages/remax-cli/src/build/webpack/config.web.ts b/packages/remax-cli/src/build/webpack/config.web.ts index d85456aa4..2f43a6fdc 100644 --- a/packages/remax-cli/src/build/webpack/config.web.ts +++ b/packages/remax-cli/src/build/webpack/config.web.ts @@ -1,4 +1,5 @@ import * as path from 'path'; +import * as fs from 'fs'; import * as webpack from 'webpack'; import Config from 'webpack-chain'; import HtmlWebpackPlugin from 'html-webpack-plugin'; @@ -32,7 +33,9 @@ export default function webpackConfig(builder: Builder): webpack.Configuration { config.plugin('html-webpack-plugin').use(HtmlWebpackPlugin, [ { - template: path.resolve(__dirname, '../../../template/index.html.ejs'), + template: fs.existsSync(path.join(builder.projectPath.publicDir(), '/index.html')) + ? path.join(builder.projectPath.publicDir(), '/index.html') + : path.resolve(__dirname, '../../../template/index.html.ejs'), env: process.env.NODE_ENV, }, ]); From 93fc4d8ad450dbb1d71ae61906a9b5342646bade Mon Sep 17 00:00:00 2001 From: juvham Date: Thu, 26 Nov 2020 22:22:11 +0800 Subject: [PATCH 4/7] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=BC=BA=E5=B0=91?= =?UTF-8?q?=E6=8B=AC=E5=8F=B7=E8=AF=AD=E6=B3=95=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/remax-cli/src/build/entries/SpaEntry.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/remax-cli/src/build/entries/SpaEntry.ts b/packages/remax-cli/src/build/entries/SpaEntry.ts index af68e1b8b..c1811c42c 100644 --- a/packages/remax-cli/src/build/entries/SpaEntry.ts +++ b/packages/remax-cli/src/build/entries/SpaEntry.ts @@ -34,7 +34,7 @@ export default class SpaEntry extends VirtualEntry { /* webpackChunkName: "${entry.name}" */ '${entry.filename}' ) -` +}` ) .join(',')} ], From 9498336a347e898fa2e75d92eac4b126a5370e2b Mon Sep 17 00:00:00 2001 From: juvham Date: Thu, 26 Nov 2020 23:18:44 +0800 Subject: [PATCH 5/7] =?UTF-8?q?fix:=20=E6=B5=8B=E8=AF=95=E9=A1=B9=E5=A2=9E?= =?UTF-8?q?=E5=8A=A0prefetch?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../fixtures/web/expected/index.js | 8 ++++-- .../fixtures/web/expected/runtime.js | 25 ++++++++++++++++--- 2 files changed, 27 insertions(+), 6 deletions(-) diff --git a/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/index.js b/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/index.js index c9058def4..30fa78787 100644 --- a/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/index.js +++ b/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/index.js @@ -38,7 +38,11 @@ Object(_remax_web__WEBPACK_IMPORTED_MODULE_1__["bootstrap"])({ "route": "pages/index/index2", "config": {} }], - pageComponents: [Promise.all(/* import() | pages/index/index */[__webpack_require__.e(2), __webpack_require__.e(3)]).then(__webpack_require__.bind(null, 8)), Promise.all(/* import() | pages/index/index2 */[__webpack_require__.e(2), __webpack_require__.e(4)]).then(__webpack_require__.bind(null, 11))], + pageComponents: [function () { + return Promise.all(/* import() | pages/index/index */[__webpack_require__.e(2), __webpack_require__.e(3)]).then(__webpack_require__.bind(null, 8)); + }, function () { + return Promise.all(/* import() | pages/index/index2 */[__webpack_require__.e(2), __webpack_require__.e(4)]).then(__webpack_require__.bind(null, 11)); + }], plugins: [] }); @@ -99,4 +103,4 @@ module.exports = require("@remax/web/assets/app.css"); module.exports = require("remax"); /***/ }) -],[[0,0]]]); \ No newline at end of file +],[[0,0]],[2,3,4]]); \ No newline at end of file diff --git a/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/runtime.js b/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/runtime.js index e090dfacb..438cfe338 100644 --- a/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/runtime.js +++ b/packages/remax-cli/src/__tests__/integration/fixtures/web/expected/runtime.js @@ -4,7 +4,7 @@ /******/ var chunkIds = data[0]; /******/ var moreModules = data[1]; /******/ var executeModules = data[2]; -/******/ +/******/ var prefetchChunks = data[3] || []; /******/ // add "moreModules" to the modules object, /******/ // then flag all "chunkIds" as loaded and fire callback /******/ var moduleId, chunkId, i = 0, resolves = []; @@ -21,7 +21,7 @@ /******/ } /******/ } /******/ if(parentJsonpFunction) parentJsonpFunction(data); -/******/ +/******/ deferredPrefetch.push.apply(deferredPrefetch, prefetchChunks); /******/ while(resolves.length) { /******/ resolves.shift()(); /******/ } @@ -46,7 +46,24 @@ /******/ result = __webpack_require__(__webpack_require__.s = deferredModule[0]); /******/ } /******/ } -/******/ +/******/ if(deferredModules.length === 0) { +/******/ // chunk prefetching for javascript +/******/ deferredPrefetch.forEach(function(chunkId) { +/******/ if(installedChunks[chunkId] === undefined) { +/******/ installedChunks[chunkId] = null; +/******/ var link = document.createElement('link'); +/******/ +/******/ if (__webpack_require__.nc) { +/******/ link.setAttribute("nonce", __webpack_require__.nc); +/******/ } +/******/ link.rel = "prefetch"; +/******/ link.as = "script"; +/******/ link.href = jsonpScriptSrc(chunkId); +/******/ document.head.appendChild(link); +/******/ } +/******/ }); +/******/ deferredPrefetch.length = 0; +/******/ } /******/ return result; /******/ } /******/ @@ -65,7 +82,7 @@ /******/ 0: 0 /******/ }; /******/ -/******/ var deferredModules = []; +/******/ var deferredModules = [], deferredPrefetch = []; /******/ /******/ // script path function /******/ function jsonpScriptSrc(chunkId) { From 80111c82d86ad042c03a9f9187786d6fe2001b0a Mon Sep 17 00:00:00 2001 From: Wei Zhu Date: Fri, 27 Nov 2020 10:10:47 +0800 Subject: [PATCH 6/7] =?UTF-8?q?fix(web):=20=E4=BF=AE=E5=A4=8D=E7=94=9F?= =?UTF-8?q?=E6=88=90=E7=8E=AF=E5=A2=83=E6=89=BE=E4=B8=8D=E5=88=B0=20React?= =?UTF-8?q?=20=E7=9A=84=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit fix #1383 --- packages/remax-cli/src/build/webpack/webBaseConfig.ts | 7 ------- 1 file changed, 7 deletions(-) diff --git a/packages/remax-cli/src/build/webpack/webBaseConfig.ts b/packages/remax-cli/src/build/webpack/webBaseConfig.ts index fe6087e40..7ce6169fb 100644 --- a/packages/remax-cli/src/build/webpack/webBaseConfig.ts +++ b/packages/remax-cli/src/build/webpack/webBaseConfig.ts @@ -60,13 +60,6 @@ export default function webBaseConfig(config: Config, builder: Builder) { config.plugin('webpack-bundle-analyzer').use(BundleAnalyzerPlugin); } - if (process.env.NODE_ENV === 'production') { - config.externals({ - react: 'React', - 'react-dom': 'ReactDOM', - }); - } - if (!builder.options.watch) { config.plugin('mini-css-extract-plugin').use(MiniCssExtractPlugin, [ { From fc188c74246ccf2f05551ef6b841a4e483186e24 Mon Sep 17 00:00:00 2001 From: jhyi Date: Fri, 4 Dec 2020 14:18:08 +0800 Subject: [PATCH 7/7] =?UTF-8?q?fix:=20#1415=20=E4=BF=AE=E5=A4=8Dcache=20ro?= =?UTF-8?q?uter=20=E6=97=A0=E6=95=88=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/remax-web/src/createApp.tsx | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/packages/remax-web/src/createApp.tsx b/packages/remax-web/src/createApp.tsx index 707aa2707..3950b0272 100644 --- a/packages/remax-web/src/createApp.tsx +++ b/packages/remax-web/src/createApp.tsx @@ -15,6 +15,17 @@ export default function createApp(options: BootstrapOptions, history: History) { const pluginDriver = new PluginDriver(plugins.map(plugin => plugin.default || plugin)); RuntimeOptions.apply({ pluginDriver }); + + const pageComponentsHoc = pages.map((page, i) => { + const pageComponent = async + ? loadable(() => + (pageComponents[i]() as Promise<{ default: React.ComponentType }>).then(({ default: c }) => + createPageConfig(c, page.route) + ) + ) + : createPageConfig(pageComponents[i]() as React.ComponentType, page.route); + return pageComponent; + }); return ( @@ -26,13 +37,7 @@ export default function createApp(options: BootstrapOptions, history: History) { return ( {(props: any) => { - const pageComponent = async - ? loadable(() => - (pageComponents[i]() as Promise<{ default: React.ComponentType }>).then(({ default: c }) => - createPageConfig(c, page.route) - ) - ) - : createPageConfig(pageComponents[i]() as React.ComponentType, page.route); + const pageComponent = pageComponentsHoc[i]; return React.createElement(pageComponent, { ...props, pageConfig: {