@tarojs/plugin-framework-react 4.0.1-alpha.1 → 4.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +8 -8
- package/dist/api-loader.js.map +1 -1
- package/dist/index.js +68 -453
- package/dist/index.js.map +1 -1
- package/dist/runtime.js +32 -36
- package/dist/runtime.js.map +1 -1
- package/package.json +30 -45
package/dist/index.js
CHANGED
|
@@ -4,7 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var helper = require('@tarojs/helper');
|
|
6
6
|
var shared = require('@tarojs/shared');
|
|
7
|
-
var tslib = require('tslib');
|
|
8
7
|
var lodash = require('lodash');
|
|
9
8
|
var acorn = require('acorn');
|
|
10
9
|
var walk = require('acorn-walk');
|
|
@@ -30,86 +29,6 @@ function _interopNamespaceDefault(e) {
|
|
|
30
29
|
var acorn__namespace = /*#__PURE__*/_interopNamespaceDefault(acorn);
|
|
31
30
|
var walk__namespace = /*#__PURE__*/_interopNamespaceDefault(walk);
|
|
32
31
|
|
|
33
|
-
function apiLoader (str) {
|
|
34
|
-
return `import {
|
|
35
|
-
useAddToFavorites,
|
|
36
|
-
useDidHide,
|
|
37
|
-
useDidShow,
|
|
38
|
-
useError,
|
|
39
|
-
useLaunch,
|
|
40
|
-
useLoad,
|
|
41
|
-
useOptionMenuClick,
|
|
42
|
-
usePageNotFound,
|
|
43
|
-
usePageScroll,
|
|
44
|
-
usePullDownRefresh,
|
|
45
|
-
usePullIntercept,
|
|
46
|
-
useReachBottom,
|
|
47
|
-
useReady,
|
|
48
|
-
useResize,
|
|
49
|
-
useRouter,
|
|
50
|
-
useSaveExitState,
|
|
51
|
-
useShareAppMessage,
|
|
52
|
-
useShareTimeline,
|
|
53
|
-
useTabItemTap,
|
|
54
|
-
useTitleClick,
|
|
55
|
-
useScope,
|
|
56
|
-
useUnhandledRejection,
|
|
57
|
-
useUnload
|
|
58
|
-
} from '@tarojs/plugin-framework-react/dist/runtime'
|
|
59
|
-
${str}
|
|
60
|
-
|
|
61
|
-
taro.useAddToFavorites = useAddToFavorites
|
|
62
|
-
taro.useDidHide = useDidHide
|
|
63
|
-
taro.useDidShow = useDidShow
|
|
64
|
-
taro.useError = useError
|
|
65
|
-
taro.useLaunch = useLaunch
|
|
66
|
-
taro.useLoad = useLoad
|
|
67
|
-
taro.useOptionMenuClick = useOptionMenuClick
|
|
68
|
-
taro.usePageNotFound = usePageNotFound
|
|
69
|
-
taro.usePageScroll = usePageScroll
|
|
70
|
-
taro.usePullDownRefresh = usePullDownRefresh
|
|
71
|
-
taro.usePullIntercept = usePullIntercept
|
|
72
|
-
taro.useReachBottom = useReachBottom
|
|
73
|
-
taro.useReady = useReady
|
|
74
|
-
taro.useResize = useResize
|
|
75
|
-
taro.useRouter = useRouter
|
|
76
|
-
taro.useSaveExitState = useSaveExitState
|
|
77
|
-
taro.useShareAppMessage = useShareAppMessage
|
|
78
|
-
taro.useShareTimeline = useShareTimeline
|
|
79
|
-
taro.useTabItemTap = useTabItemTap
|
|
80
|
-
taro.useTitleClick = useTitleClick
|
|
81
|
-
taro.useScope = useScope
|
|
82
|
-
taro.useUnhandledRejection = useUnhandledRejection
|
|
83
|
-
taro.useUnload = useUnload
|
|
84
|
-
|
|
85
|
-
export {
|
|
86
|
-
useAddToFavorites,
|
|
87
|
-
useDidHide,
|
|
88
|
-
useDidShow,
|
|
89
|
-
useError,
|
|
90
|
-
useLaunch,
|
|
91
|
-
useLoad,
|
|
92
|
-
useOptionMenuClick,
|
|
93
|
-
usePageNotFound,
|
|
94
|
-
usePageScroll,
|
|
95
|
-
usePullDownRefresh,
|
|
96
|
-
usePullIntercept,
|
|
97
|
-
useReachBottom,
|
|
98
|
-
useReady,
|
|
99
|
-
useResize,
|
|
100
|
-
useRouter,
|
|
101
|
-
useSaveExitState,
|
|
102
|
-
useShareAppMessage,
|
|
103
|
-
useShareTimeline,
|
|
104
|
-
useTabItemTap,
|
|
105
|
-
useTitleClick,
|
|
106
|
-
useScope,
|
|
107
|
-
useUnhandledRejection,
|
|
108
|
-
useUnload
|
|
109
|
-
}
|
|
110
|
-
`;
|
|
111
|
-
}
|
|
112
|
-
|
|
113
32
|
function addConfig(source) {
|
|
114
33
|
const configsMap = {
|
|
115
34
|
enableShareAppMessage: ['onShareAppMessage', 'useShareAppMessage'],
|
|
@@ -161,6 +80,20 @@ function addConfig(source) {
|
|
|
161
80
|
});
|
|
162
81
|
return additionConfig;
|
|
163
82
|
}
|
|
83
|
+
const nervMeta = {
|
|
84
|
+
importFrameworkStatement: `
|
|
85
|
+
import Nerv from 'nervjs';
|
|
86
|
+
`,
|
|
87
|
+
mockAppStatement: `
|
|
88
|
+
class App extends Nerv.Component {
|
|
89
|
+
render () {
|
|
90
|
+
return this.props.children
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
`,
|
|
94
|
+
frameworkArgs: 'Nerv, Nerv, config',
|
|
95
|
+
importFrameworkName: 'Nerv'
|
|
96
|
+
};
|
|
164
97
|
function getLoaderMeta(framework) {
|
|
165
98
|
const loaderMeta = {
|
|
166
99
|
importFrameworkStatement: `
|
|
@@ -184,6 +117,9 @@ class App extends React.Component {
|
|
|
184
117
|
Object.assign(config, addConfig(source));
|
|
185
118
|
}
|
|
186
119
|
};
|
|
120
|
+
if (framework === 'nerv') {
|
|
121
|
+
Object.assign(loaderMeta, nervMeta);
|
|
122
|
+
}
|
|
187
123
|
if (process.env.TARO_PLATFORM === 'web') {
|
|
188
124
|
if (framework === 'react') {
|
|
189
125
|
const react = require('react');
|
|
@@ -199,222 +135,9 @@ class App extends React.Component {
|
|
|
199
135
|
return loaderMeta;
|
|
200
136
|
}
|
|
201
137
|
|
|
202
|
-
function h5iVitePlugin(ctx, framework) {
|
|
203
|
-
return [
|
|
204
|
-
injectLoaderMeta$2(ctx, framework),
|
|
205
|
-
setTaroApi(),
|
|
206
|
-
esbuildExclude(framework)
|
|
207
|
-
];
|
|
208
|
-
}
|
|
209
|
-
function injectLoaderMeta$2(ctx, framework) {
|
|
210
|
-
function customizer(object = '', sources = '') {
|
|
211
|
-
if ([object, sources].every(e => typeof e === 'string'))
|
|
212
|
-
return object + sources;
|
|
213
|
-
}
|
|
214
|
-
const { runnerUtils } = ctx;
|
|
215
|
-
const { getViteH5CompilerContext } = runnerUtils;
|
|
216
|
-
return {
|
|
217
|
-
name: 'taro-react:loader-meta',
|
|
218
|
-
buildStart() {
|
|
219
|
-
return tslib.__awaiter(this, void 0, void 0, function* () {
|
|
220
|
-
const viteCompilerContext = yield getViteH5CompilerContext(this);
|
|
221
|
-
if (viteCompilerContext) {
|
|
222
|
-
viteCompilerContext.loaderMeta = lodash.mergeWith(getLoaderMeta(framework), viteCompilerContext.loaderMeta, customizer);
|
|
223
|
-
}
|
|
224
|
-
});
|
|
225
|
-
}
|
|
226
|
-
};
|
|
227
|
-
}
|
|
228
|
-
function setTaroApi() {
|
|
229
|
-
// dev 环境通过 esbuild 来做; pro 环境通过 rollup load 钩子来做;因为生产环境不会走 esbuild
|
|
230
|
-
return {
|
|
231
|
-
name: 'taro-react:process-import-taro',
|
|
232
|
-
enforce: 'pre',
|
|
233
|
-
config: () => ({
|
|
234
|
-
optimizeDeps: {
|
|
235
|
-
esbuildOptions: {
|
|
236
|
-
plugins: [
|
|
237
|
-
{
|
|
238
|
-
name: 'taro:react-api',
|
|
239
|
-
setup(build) {
|
|
240
|
-
build.onLoad({ filter: helper.REG_TARO_H5_RUNTIME_API }, (args) => tslib.__awaiter(this, void 0, void 0, function* () {
|
|
241
|
-
const input = yield helper.fs.readFile(args.path, 'utf8');
|
|
242
|
-
return {
|
|
243
|
-
contents: apiLoader(input + '\n' + 'const taro = Taro__default\n')
|
|
244
|
-
};
|
|
245
|
-
}));
|
|
246
|
-
},
|
|
247
|
-
}
|
|
248
|
-
]
|
|
249
|
-
}
|
|
250
|
-
},
|
|
251
|
-
}),
|
|
252
|
-
load(id) {
|
|
253
|
-
return tslib.__awaiter(this, void 0, void 0, function* () {
|
|
254
|
-
if (process.env.NODE_ENV === 'production' && helper.REG_TARO_H5_RUNTIME_API.test(id)) {
|
|
255
|
-
try {
|
|
256
|
-
const input = yield helper.fs.readFile(id, 'utf8');
|
|
257
|
-
return apiLoader(input + '\n' + 'const taro = Taro__default\n');
|
|
258
|
-
}
|
|
259
|
-
catch (_) {
|
|
260
|
-
return null;
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
|
-
});
|
|
264
|
-
}
|
|
265
|
-
};
|
|
266
|
-
}
|
|
267
|
-
// todo 后面看看能否把 preact 改为虚拟模块
|
|
268
|
-
function esbuildExclude(framework) {
|
|
269
|
-
if (framework !== 'preact')
|
|
270
|
-
return null;
|
|
271
|
-
return {
|
|
272
|
-
name: 'taro-react:esvuild-exclude',
|
|
273
|
-
enforce: 'pre',
|
|
274
|
-
config: () => ({
|
|
275
|
-
optimizeDeps: {
|
|
276
|
-
exclude: ['react', 'preact']
|
|
277
|
-
}
|
|
278
|
-
})
|
|
279
|
-
};
|
|
280
|
-
}
|
|
281
|
-
|
|
282
|
-
function harmonyVitePlugin(ctx, framework) {
|
|
283
|
-
return [
|
|
284
|
-
injectLoaderMeta$1(ctx, framework),
|
|
285
|
-
aliasPlugin$1(ctx, framework),
|
|
286
|
-
];
|
|
287
|
-
}
|
|
288
|
-
function injectLoaderMeta$1(ctx, framework) {
|
|
289
|
-
return {
|
|
290
|
-
name: 'taro-react:loader-meta',
|
|
291
|
-
buildStart() {
|
|
292
|
-
const { runnerUtils } = ctx;
|
|
293
|
-
const { getViteHarmonyCompilerContext } = runnerUtils;
|
|
294
|
-
const viteCompilerContext = getViteHarmonyCompilerContext(this);
|
|
295
|
-
if (viteCompilerContext) {
|
|
296
|
-
viteCompilerContext.loaderMeta || (viteCompilerContext.loaderMeta = {});
|
|
297
|
-
Object.assign(viteCompilerContext.loaderMeta, getLoaderMeta(framework));
|
|
298
|
-
}
|
|
299
|
-
}
|
|
300
|
-
};
|
|
301
|
-
}
|
|
302
|
-
function aliasPlugin$1(ctx, framework) {
|
|
303
|
-
if (framework === 'react') {
|
|
304
|
-
return {
|
|
305
|
-
name: 'taro-react:alias',
|
|
306
|
-
config(config) {
|
|
307
|
-
var _a;
|
|
308
|
-
const alias = [
|
|
309
|
-
{ find: /react-dom$/, replacement: '@tarojs/react' },
|
|
310
|
-
{ find: /react-dom\/client$/, replacement: '@tarojs/react' },
|
|
311
|
-
];
|
|
312
|
-
const mainFields = ['unpkg', ...helper.defaultMainFields];
|
|
313
|
-
const resolveOptions = {
|
|
314
|
-
basedir: process.cwd(),
|
|
315
|
-
mainFields,
|
|
316
|
-
};
|
|
317
|
-
const isProd = config.mode === 'production';
|
|
318
|
-
// TODO:harmony 目前会导致部分包用 production 版本,部分用 development 版本,导致许多 api 报错
|
|
319
|
-
const isHarmony = ctx.runOpts.options.platform === 'harmony';
|
|
320
|
-
if (!isProd && ((_a = ctx.initialConfig.harmony) === null || _a === void 0 ? void 0 : _a.debugReact) !== true && !isHarmony) {
|
|
321
|
-
// 在React18中,使用了exports字段约定了模块暴露路径,其中并未暴露 ./cjs/ 。这将使上面的alias在编译时报错。相当的tricky。
|
|
322
|
-
// Why writeJson? prebundle will load package.json via readFile to check exports property.
|
|
323
|
-
const reactPkgPath = helper.resolveSync('react/package.json', resolveOptions);
|
|
324
|
-
if (reactPkgPath) {
|
|
325
|
-
const reactPkg = require('react/package.json');
|
|
326
|
-
const reactVersion = (reactPkg.version || '');
|
|
327
|
-
if ((/^[~^]?18/).test(reactVersion) && reactPkg.exports) {
|
|
328
|
-
reactPkg.exports = Object.assign(reactPkg.exports, {
|
|
329
|
-
'./cjs/': './cjs/'
|
|
330
|
-
});
|
|
331
|
-
helper.fs.writeJsonSync(reactPkgPath, reactPkg, { spaces: 2 });
|
|
332
|
-
}
|
|
333
|
-
}
|
|
334
|
-
}
|
|
335
|
-
return {
|
|
336
|
-
resolve: {
|
|
337
|
-
alias
|
|
338
|
-
}
|
|
339
|
-
};
|
|
340
|
-
}
|
|
341
|
-
};
|
|
342
|
-
}
|
|
343
|
-
return [];
|
|
344
|
-
}
|
|
345
|
-
|
|
346
|
-
function miniVitePlugin(ctx, framework) {
|
|
347
|
-
return [
|
|
348
|
-
injectLoaderMeta(ctx, framework),
|
|
349
|
-
aliasPlugin(ctx, framework),
|
|
350
|
-
];
|
|
351
|
-
}
|
|
352
|
-
function injectLoaderMeta(ctx, framework) {
|
|
353
|
-
return {
|
|
354
|
-
name: 'taro-react:loader-meta',
|
|
355
|
-
buildStart() {
|
|
356
|
-
const { runnerUtils } = ctx;
|
|
357
|
-
const { getViteMiniCompilerContext } = runnerUtils;
|
|
358
|
-
const viteCompilerContext = getViteMiniCompilerContext(this);
|
|
359
|
-
if (viteCompilerContext) {
|
|
360
|
-
viteCompilerContext.loaderMeta || (viteCompilerContext.loaderMeta = {});
|
|
361
|
-
Object.assign(viteCompilerContext.loaderMeta, getLoaderMeta(framework));
|
|
362
|
-
}
|
|
363
|
-
}
|
|
364
|
-
};
|
|
365
|
-
}
|
|
366
|
-
function aliasPlugin(ctx, framework) {
|
|
367
|
-
if (framework === 'react') {
|
|
368
|
-
return {
|
|
369
|
-
name: 'taro-react:alias',
|
|
370
|
-
config(config) {
|
|
371
|
-
var _a;
|
|
372
|
-
const alias = [
|
|
373
|
-
{ find: /react-dom$/, replacement: '@tarojs/react' },
|
|
374
|
-
{ find: /react-dom\/client$/, replacement: '@tarojs/react' },
|
|
375
|
-
];
|
|
376
|
-
const mainFields = ['unpkg', ...helper.defaultMainFields];
|
|
377
|
-
const resolveOptions = {
|
|
378
|
-
basedir: process.cwd(),
|
|
379
|
-
mainFields,
|
|
380
|
-
};
|
|
381
|
-
const isProd = config.mode === 'production';
|
|
382
|
-
// TODO:harmony 目前会导致部分包用 production 版本,部分用 development 版本,导致许多 api 报错
|
|
383
|
-
const isHarmony = ctx.runOpts.options.platform === 'harmony';
|
|
384
|
-
if (!isProd && ((_a = ctx.initialConfig.mini) === null || _a === void 0 ? void 0 : _a.debugReact) !== true && !isHarmony) {
|
|
385
|
-
// 不是生产环境,且没有设置 debugReact,则使用压缩版本的 react 依赖,减少体积
|
|
386
|
-
alias.push({ find: /react-reconciler$/, replacement: 'react-reconciler/cjs/react-reconciler.production.min.js' });
|
|
387
|
-
alias.push({ find: /^(?!.*mobx-react$).*react$/, replacement: 'react/cjs/react.production.min.js' });
|
|
388
|
-
alias.push({ find: /scheduler$/, replacement: 'scheduler/cjs/scheduler.production.min.js' });
|
|
389
|
-
alias.push({ find: /react\/jsx-runtime$/, replacement: 'react/cjs/react-jsx-runtime.production.min.js' });
|
|
390
|
-
// 在React18中,使用了exports字段约定了模块暴露路径,其中并未暴露 ./cjs/ 。这将使上面的alias在编译时报错。相当的tricky。
|
|
391
|
-
// Why writeJson? prebundle will load package.json via readFile to check exports property.
|
|
392
|
-
const reactPkgPath = helper.resolveSync('react/package.json', resolveOptions);
|
|
393
|
-
if (reactPkgPath) {
|
|
394
|
-
const reactPkg = require('react/package.json');
|
|
395
|
-
const reactVersion = (reactPkg.version || '');
|
|
396
|
-
if ((/^[~^]?18/).test(reactVersion) && reactPkg.exports) {
|
|
397
|
-
reactPkg.exports = Object.assign(reactPkg.exports, {
|
|
398
|
-
'./cjs/': './cjs/'
|
|
399
|
-
});
|
|
400
|
-
helper.fs.writeJsonSync(reactPkgPath, reactPkg, { spaces: 2 });
|
|
401
|
-
}
|
|
402
|
-
}
|
|
403
|
-
}
|
|
404
|
-
return {
|
|
405
|
-
resolve: {
|
|
406
|
-
alias
|
|
407
|
-
}
|
|
408
|
-
};
|
|
409
|
-
}
|
|
410
|
-
};
|
|
411
|
-
}
|
|
412
|
-
return [];
|
|
413
|
-
}
|
|
414
|
-
|
|
415
138
|
function modifyH5WebpackChain(ctx, framework, chain) {
|
|
416
139
|
var _a;
|
|
417
|
-
setLoader$
|
|
140
|
+
setLoader$1(framework, chain);
|
|
418
141
|
setPlugin(ctx, framework, chain);
|
|
419
142
|
const { isBuildNativeComp = false } = ((_a = ctx.runOpts) === null || _a === void 0 ? void 0 : _a.options) || {};
|
|
420
143
|
const externals = {};
|
|
@@ -444,19 +167,20 @@ function modifyH5WebpackChain(ctx, framework, chain) {
|
|
|
444
167
|
module: {
|
|
445
168
|
rule: {
|
|
446
169
|
'process-import-taro-h5': {
|
|
447
|
-
test:
|
|
448
|
-
loader: require.resolve('./api-loader')
|
|
449
|
-
}
|
|
450
|
-
}
|
|
170
|
+
test: /taro-h5[\\/]dist[\\/]api[\\/]taro/,
|
|
171
|
+
loader: require.resolve('./api-loader')
|
|
172
|
+
}
|
|
173
|
+
}
|
|
451
174
|
},
|
|
452
175
|
});
|
|
453
176
|
}
|
|
454
|
-
function setLoader$
|
|
177
|
+
function setLoader$1(framework, chain) {
|
|
455
178
|
function customizer(object = '', sources = '') {
|
|
456
|
-
if ([object, sources].every(
|
|
179
|
+
if ([object, sources].every(e => typeof e === 'string'))
|
|
457
180
|
return object + sources;
|
|
458
181
|
}
|
|
459
|
-
chain.plugin('mainPlugin')
|
|
182
|
+
chain.plugin('mainPlugin')
|
|
183
|
+
.tap(args => {
|
|
460
184
|
args[0].loaderMeta = lodash.mergeWith(getLoaderMeta(framework), args[0].loaderMeta, customizer);
|
|
461
185
|
return args;
|
|
462
186
|
});
|
|
@@ -469,75 +193,19 @@ function setPlugin(ctx, framework, chain) {
|
|
|
469
193
|
if (!isProd && ((_b = (_a = config.h5) === null || _a === void 0 ? void 0 : _a.devServer) === null || _b === void 0 ? void 0 : _b.hot) !== false) {
|
|
470
194
|
// 默认开启 fast-refresh
|
|
471
195
|
if (framework === 'react') {
|
|
472
|
-
chain
|
|
196
|
+
chain
|
|
197
|
+
.plugin('fastRefreshPlugin')
|
|
198
|
+
.use(require('@pmmmwh/react-refresh-webpack-plugin'));
|
|
473
199
|
}
|
|
474
200
|
else if (framework === 'preact') {
|
|
475
|
-
chain
|
|
476
|
-
|
|
201
|
+
chain
|
|
202
|
+
.plugin('hotModuleReplacementPlugin')
|
|
203
|
+
.use(require('webpack').HotModuleReplacementPlugin);
|
|
204
|
+
chain
|
|
205
|
+
.plugin('fastRefreshPlugin')
|
|
206
|
+
.use(require('@prefresh/webpack'));
|
|
477
207
|
}
|
|
478
208
|
}
|
|
479
|
-
const mainFields = ['unpkg', ...helper.defaultMainFields];
|
|
480
|
-
const resolveOptions = {
|
|
481
|
-
basedir: process.cwd(),
|
|
482
|
-
mainFields,
|
|
483
|
-
};
|
|
484
|
-
if (framework === 'react') {
|
|
485
|
-
const alias = chain.resolve.alias;
|
|
486
|
-
// Note: 本地 link 调试时,避免 react 重复打包
|
|
487
|
-
alias.set('react$', helper.resolveSync('react', resolveOptions));
|
|
488
|
-
alias.set('react-dom$', helper.resolveSync('react-dom', resolveOptions));
|
|
489
|
-
}
|
|
490
|
-
}
|
|
491
|
-
|
|
492
|
-
function modifyHarmonyWebpackChain(ctx, framework, chain) {
|
|
493
|
-
setAlias$2(ctx, framework, chain);
|
|
494
|
-
setLoader$1(framework, chain);
|
|
495
|
-
}
|
|
496
|
-
function setAlias$2(ctx, framework, chain) {
|
|
497
|
-
var _a;
|
|
498
|
-
const config = ctx.initialConfig;
|
|
499
|
-
const alias = chain.resolve.alias;
|
|
500
|
-
const mainFields = ['unpkg', ...helper.defaultMainFields];
|
|
501
|
-
const resolveOptions = {
|
|
502
|
-
basedir: process.cwd(),
|
|
503
|
-
mainFields,
|
|
504
|
-
};
|
|
505
|
-
if (framework === 'react') {
|
|
506
|
-
alias.set('react-dom$', '@tarojs/react');
|
|
507
|
-
alias.set('react-dom/client$', '@tarojs/react');
|
|
508
|
-
const webpackConfig = chain.toConfig();
|
|
509
|
-
const isProd = webpackConfig.mode === 'production';
|
|
510
|
-
if (!isProd && ((_a = config.harmony) === null || _a === void 0 ? void 0 : _a.debugReact) !== true) {
|
|
511
|
-
// 不是生产环境,且没有设置 debugReact,则使用压缩版本的 react 依赖,减少体积
|
|
512
|
-
// 兼容pnpm workspace
|
|
513
|
-
const reactModulePath = helper.resolveSync('react', resolveOptions);
|
|
514
|
-
const newFilePath = path.join(path.dirname(reactModulePath), 'cjs', 'react.production.min.js');
|
|
515
|
-
alias.set('react-reconciler$', 'react-reconciler/cjs/react-reconciler.production.min.js');
|
|
516
|
-
alias.set('react$', newFilePath);
|
|
517
|
-
alias.set('react/jsx-runtime$', 'react/cjs/react-jsx-runtime.production.min.js');
|
|
518
|
-
// 在React18中,使用了exports字段约定了模块暴露路径,其中并未暴露 ./cjs/ 。这将使上面的alias在编译时报错。相当的tricky。
|
|
519
|
-
// Why writeJson? prebundle will load package.json via readFile to check exports property.
|
|
520
|
-
const reactPkgPath = helper.resolveSync('react/package.json', resolveOptions);
|
|
521
|
-
if (reactPkgPath) {
|
|
522
|
-
const reactPkg = require('react/package.json');
|
|
523
|
-
const reactVersion = reactPkg.version || '';
|
|
524
|
-
if (/^[~^]?18/.test(reactVersion) && reactPkg.exports) {
|
|
525
|
-
reactPkg.exports = Object.assign(reactPkg.exports, {
|
|
526
|
-
'./cjs/': './cjs/',
|
|
527
|
-
});
|
|
528
|
-
helper.fs.writeJsonSync(reactPkgPath, reactPkg, { spaces: 2 });
|
|
529
|
-
}
|
|
530
|
-
}
|
|
531
|
-
}
|
|
532
|
-
}
|
|
533
|
-
}
|
|
534
|
-
function setLoader$1(framework, chain) {
|
|
535
|
-
chain.plugin('mainPlugin').tap((args) => {
|
|
536
|
-
var _a;
|
|
537
|
-
(_a = args[0]).loaderMeta || (_a.loaderMeta = {});
|
|
538
|
-
Object.assign(args[0].loaderMeta, getLoaderMeta(framework));
|
|
539
|
-
return args;
|
|
540
|
-
});
|
|
541
209
|
}
|
|
542
210
|
|
|
543
211
|
function modifyMiniWebpackChain(ctx, framework, chain) {
|
|
@@ -548,11 +216,6 @@ function setAlias$1(ctx, framework, chain) {
|
|
|
548
216
|
var _a;
|
|
549
217
|
const config = ctx.initialConfig;
|
|
550
218
|
const alias = chain.resolve.alias;
|
|
551
|
-
const mainFields = ['unpkg', ...helper.defaultMainFields];
|
|
552
|
-
const resolveOptions = {
|
|
553
|
-
basedir: process.cwd(),
|
|
554
|
-
mainFields,
|
|
555
|
-
};
|
|
556
219
|
if (framework === 'react') {
|
|
557
220
|
alias.set('react-dom$', '@tarojs/react');
|
|
558
221
|
alias.set('react-dom/client$', '@tarojs/react');
|
|
@@ -561,14 +224,14 @@ function setAlias$1(ctx, framework, chain) {
|
|
|
561
224
|
if (!isProd && ((_a = config.mini) === null || _a === void 0 ? void 0 : _a.debugReact) !== true) {
|
|
562
225
|
// 不是生产环境,且没有设置 debugReact,则使用压缩版本的 react 依赖,减少体积
|
|
563
226
|
// 兼容pnpm workspace
|
|
564
|
-
const reactModulePath =
|
|
227
|
+
const reactModulePath = require.resolve('react', { paths: [process.cwd()] });
|
|
565
228
|
const newFilePath = path.join(path.dirname(reactModulePath), 'cjs', 'react.production.min.js');
|
|
566
229
|
alias.set('react-reconciler$', 'react-reconciler/cjs/react-reconciler.production.min.js');
|
|
567
|
-
alias.set(
|
|
230
|
+
alias.set('react$', newFilePath);
|
|
568
231
|
alias.set('react/jsx-runtime$', 'react/cjs/react-jsx-runtime.production.min.js');
|
|
569
232
|
// 在React18中,使用了exports字段约定了模块暴露路径,其中并未暴露 ./cjs/ 。这将使上面的alias在编译时报错。相当的tricky。
|
|
570
233
|
// Why writeJson? prebundle will load package.json via readFile to check exports property.
|
|
571
|
-
const reactPkgPath =
|
|
234
|
+
const reactPkgPath = require.resolve('react/package.json', { paths: [process.cwd()] });
|
|
572
235
|
if (reactPkgPath) {
|
|
573
236
|
const reactPkg = require('react/package.json');
|
|
574
237
|
const reactVersion = reactPkg.version || '';
|
|
@@ -584,31 +247,29 @@ function setAlias$1(ctx, framework, chain) {
|
|
|
584
247
|
}
|
|
585
248
|
function setLoader(framework, chain) {
|
|
586
249
|
chain.plugin('miniPlugin').tap((args) => {
|
|
587
|
-
|
|
588
|
-
(_a = args[0]).loaderMeta || (_a.loaderMeta = {});
|
|
589
|
-
Object.assign(args[0].loaderMeta, getLoaderMeta(framework));
|
|
250
|
+
args[0].loaderMeta = getLoaderMeta(framework);
|
|
590
251
|
return args;
|
|
591
252
|
});
|
|
592
253
|
}
|
|
593
254
|
|
|
594
|
-
function isReactLike(framework = 'react') {
|
|
595
|
-
return ['react', 'preact'].includes(framework);
|
|
596
|
-
}
|
|
597
255
|
var index = (ctx) => {
|
|
598
|
-
const { framework
|
|
599
|
-
if (
|
|
256
|
+
const { framework } = ctx.initialConfig;
|
|
257
|
+
if (framework !== 'react' && framework !== 'nerv' && framework !== 'preact')
|
|
600
258
|
return;
|
|
601
259
|
ctx.modifyWebpackChain(({ chain }) => {
|
|
602
260
|
// 通用
|
|
603
261
|
setAlias(framework, chain);
|
|
262
|
+
chain
|
|
263
|
+
.plugin('definePlugin')
|
|
264
|
+
.tap(args => {
|
|
265
|
+
const config = args[0];
|
|
266
|
+
config.__TARO_FRAMEWORK__ = `"${framework}"`;
|
|
267
|
+
return args;
|
|
268
|
+
});
|
|
604
269
|
if (process.env.TARO_PLATFORM === 'web') {
|
|
605
270
|
// H5
|
|
606
271
|
modifyH5WebpackChain(ctx, framework, chain);
|
|
607
272
|
}
|
|
608
|
-
else if (process.env.TARO_PLATFORM === 'harmony' || process.env.TARO_ENV === 'harmony') {
|
|
609
|
-
// 鸿蒙
|
|
610
|
-
modifyHarmonyWebpackChain(ctx, framework, chain);
|
|
611
|
-
}
|
|
612
273
|
else {
|
|
613
274
|
// 小程序
|
|
614
275
|
modifyMiniWebpackChain(ctx, framework, chain);
|
|
@@ -619,13 +280,18 @@ var index = (ctx) => {
|
|
|
619
280
|
return;
|
|
620
281
|
if (shared.isString(opts.compiler)) {
|
|
621
282
|
opts.compiler = {
|
|
622
|
-
type: opts.compiler
|
|
283
|
+
type: opts.compiler
|
|
623
284
|
};
|
|
624
285
|
}
|
|
625
286
|
const { compiler } = opts;
|
|
626
287
|
if (compiler.type === 'webpack5') {
|
|
627
288
|
// 提供给 webpack5 依赖预编译收集器的第三方依赖
|
|
628
|
-
const deps = [
|
|
289
|
+
const deps = [
|
|
290
|
+
'react',
|
|
291
|
+
'react-dom',
|
|
292
|
+
'react/jsx-runtime',
|
|
293
|
+
'@tarojs/plugin-framework-react/dist/runtime'
|
|
294
|
+
];
|
|
629
295
|
compiler.prebundle || (compiler.prebundle = {});
|
|
630
296
|
const prebundleOptions = compiler.prebundle;
|
|
631
297
|
prebundleOptions.include || (prebundleOptions.include = []);
|
|
@@ -637,10 +303,10 @@ var index = (ctx) => {
|
|
|
637
303
|
const taroReactPlugin = {
|
|
638
304
|
name: 'taroReactPlugin',
|
|
639
305
|
setup(build) {
|
|
640
|
-
build.onLoad({ filter:
|
|
306
|
+
build.onLoad({ filter: /taro-h5[\\/]dist[\\/]api[\\/]taro/ }, ({ path }) => {
|
|
641
307
|
const content = helper.fs.readFileSync(path).toString();
|
|
642
308
|
return {
|
|
643
|
-
contents: require('./api-loader')(content)
|
|
309
|
+
contents: require('./api-loader')(content)
|
|
644
310
|
};
|
|
645
311
|
});
|
|
646
312
|
}
|
|
@@ -650,74 +316,23 @@ var index = (ctx) => {
|
|
|
650
316
|
esbuildConfig.plugins || (esbuildConfig.plugins = []);
|
|
651
317
|
esbuildConfig.plugins.push(taroReactPlugin);
|
|
652
318
|
}
|
|
653
|
-
else if (compiler.type === 'vite') {
|
|
654
|
-
compiler.vitePlugins || (compiler.vitePlugins = []);
|
|
655
|
-
compiler.vitePlugins.push(viteCommonPlugin(framework));
|
|
656
|
-
compiler.vitePlugins.push(VitePresetPlugin(framework));
|
|
657
|
-
if (process.env.TARO_PLATFORM === 'web') {
|
|
658
|
-
// H5
|
|
659
|
-
compiler.vitePlugins.push(h5iVitePlugin(ctx, framework));
|
|
660
|
-
}
|
|
661
|
-
else if (process.env.TARO_PLATFORM === 'harmony' || process.env.TARO_ENV === 'harmony') {
|
|
662
|
-
// 鸿蒙
|
|
663
|
-
compiler.vitePlugins.push(harmonyVitePlugin(ctx, framework));
|
|
664
|
-
}
|
|
665
|
-
else {
|
|
666
|
-
// 小程序
|
|
667
|
-
compiler.vitePlugins.push(miniVitePlugin(ctx, framework));
|
|
668
|
-
}
|
|
669
|
-
}
|
|
670
319
|
});
|
|
671
320
|
};
|
|
672
321
|
function setAlias(framework, chain) {
|
|
673
322
|
const alias = chain.resolve.alias;
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
323
|
+
switch (framework) {
|
|
324
|
+
case 'preact':
|
|
325
|
+
alias.set('react', 'preact/compat');
|
|
326
|
+
alias.set('react-dom/test-utils', 'preact/test-utils');
|
|
327
|
+
alias.set('react-dom', 'preact/compat');
|
|
328
|
+
alias.set('react/jsx-runtime', 'preact/jsx-runtime');
|
|
329
|
+
break;
|
|
330
|
+
case 'nerv':
|
|
331
|
+
alias.set('react$', 'nervjs');
|
|
332
|
+
alias.set('react-dom$', 'nervjs');
|
|
333
|
+
break;
|
|
679
334
|
}
|
|
680
335
|
}
|
|
681
|
-
function VitePresetPlugin(framework) {
|
|
682
|
-
return framework === 'preact'
|
|
683
|
-
? require('@preact/preset-vite').preact({
|
|
684
|
-
babel: {
|
|
685
|
-
plugins: [
|
|
686
|
-
['@babel/plugin-proposal-decorators', { legacy: true }],
|
|
687
|
-
['@babel/plugin-proposal-class-properties', { loose: true }],
|
|
688
|
-
],
|
|
689
|
-
},
|
|
690
|
-
})
|
|
691
|
-
: require('@vitejs/plugin-react').default({
|
|
692
|
-
babel: {
|
|
693
|
-
plugins: [
|
|
694
|
-
['@babel/plugin-proposal-decorators', { legacy: true }],
|
|
695
|
-
['@babel/plugin-proposal-class-properties', { loose: true }],
|
|
696
|
-
],
|
|
697
|
-
},
|
|
698
|
-
});
|
|
699
|
-
}
|
|
700
|
-
function viteCommonPlugin(framework) {
|
|
701
|
-
return {
|
|
702
|
-
name: 'taro-react:common',
|
|
703
|
-
config() {
|
|
704
|
-
const alias = framework === 'preact'
|
|
705
|
-
? [
|
|
706
|
-
{ find: 'react', replacement: 'preact/compat' },
|
|
707
|
-
{ find: 'react-dom/test-utils', replacement: 'preact/test-utils' },
|
|
708
|
-
{ find: 'react-dom', replacement: 'preact/compat' },
|
|
709
|
-
{ find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' },
|
|
710
|
-
]
|
|
711
|
-
: [];
|
|
712
|
-
return {
|
|
713
|
-
resolve: {
|
|
714
|
-
alias,
|
|
715
|
-
},
|
|
716
|
-
};
|
|
717
|
-
},
|
|
718
|
-
};
|
|
719
|
-
}
|
|
720
336
|
|
|
721
337
|
exports.default = index;
|
|
722
|
-
exports.isReactLike = isReactLike;
|
|
723
338
|
//# sourceMappingURL=index.js.map
|