From 5585009a6d898a995147b6b02011069e78434337 Mon Sep 17 00:00:00 2001 From: xuegan Date: Fri, 20 Oct 2023 12:59:12 +0800 Subject: [PATCH 1/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E8=BE=93=E5=87=BA?= =?UTF-8?q?ali/web=20root-view=20srcMode=E5=88=A4=E6=96=AD=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs-vuepress/api/compile.md | 76 +++++++++---------- .../lib/template-compiler/compiler.js | 2 +- 2 files changed, 37 insertions(+), 41 deletions(-) diff --git a/docs-vuepress/api/compile.md b/docs-vuepress/api/compile.md index 82a6ccc22a..2ef97433a5 100644 --- a/docs-vuepress/api/compile.md +++ b/docs-vuepress/api/compile.md @@ -1565,50 +1565,13 @@ module.exports = defineConfig({ }) ``` -## MpxWebpackPlugin static methods - -`MpxWebpackPlugin` 通过静态方法暴露了以下五个内置 loader,详情如下: - -### MpxWebpackPlugin.loader - -`MpxWebpackPlugin` 所提供的最主要 loader,用于处理 `.mpx` 文件,根据不同的[目标平台](#mode)将 `.mpx` 文件输出为不同的结果。 - -> 在微信环境下 `todo.mpx` 被loader处理后的文件为:`todo.wxml`、`todo.wxss`、`todo.js`、`todo.json` - -```js -module.exports = { - module: { - rules: [ - { - test: /\.mpx$/, - use: MpxWebpackPlugin.loader() - } - ] - } -}; -``` - -::: tip -在 `@mpxjs/cli 3.x`版本已经内置了对于 `pug` 的支持,只需要安装 `pug` 依赖相关即可: - -```javascript -npm install -D pug pug-plain-loader -``` -::: - -##### Options.excludedPreLoaders `{RegExp}` - -在构建过程中忽略特定 `pre-loader` 对文件的处理,仅支持正则表达式,默认值为 `/eslint-loader/`。 - ### proxyComponentEventsRules - **类型**:`Array | Object` - `option.include` 同webpack的include规则 - `option.exclude` 同webpack的exclude规则 - `option.events` 需要在支付宝环境代理的事件,数组形式的支付宝事件名,例如['onTap', 'onTouchMove'] - -- **详细**: - + 在微信小程序中,自定义组件本身的那个节点是一个“普通”的节点,使用时可以在这个节点上设置 class style、事件、 flex 布局等,就如同普通的 view 组件节点一样。 在支付宝平台下,自定义组件节点默认是虚拟节点,会展示自定义组件内部的第一层节点,自定义组件节点本身设置的 class style 等不会生效。 @@ -1619,8 +1582,6 @@ style、class、绑定事件等 copy 至包裹节点,对于事件来说,由 跨端输出Web时,为了和微信小程序保持一致,在非virtualHost的自定义组件节点上,默认也会插入一个包裹节点,同理对于事件的代理也需要用户进行配置告诉框架来对哪些自定义组件的哪些事件进行代理。 -- **示例**: - 当我们在小程序开发时存在以下代码时 ```html @@ -1651,6 +1612,41 @@ new MpxWebpackPlugin({ 请注意,在跨端输出 Web 时,只支持配置 tap 、longtap、longpress 这三个事件代理,且最好不要同时配置了两个事件,不然有可能会导致同一个事件触发两次。 +## MpxWebpackPlugin static methods + +`MpxWebpackPlugin` 通过静态方法暴露了以下五个内置 loader,详情如下: + +### MpxWebpackPlugin.loader + +`MpxWebpackPlugin` 所提供的最主要 loader,用于处理 `.mpx` 文件,根据不同的[目标平台](#mode)将 `.mpx` 文件输出为不同的结果。 + +> 在微信环境下 `todo.mpx` 被loader处理后的文件为:`todo.wxml`、`todo.wxss`、`todo.js`、`todo.json` + +```js +module.exports = { + module: { + rules: [ + { + test: /\.mpx$/, + use: MpxWebpackPlugin.loader() + } + ] + } +}; +``` + +::: tip +在 `@mpxjs/cli 3.x`版本已经内置了对于 `pug` 的支持,只需要安装 `pug` 依赖相关即可: + +```javascript +npm install -D pug pug-plain-loader +``` +::: + +##### Options.excludedPreLoaders `{RegExp}` + +在构建过程中忽略特定 `pre-loader` 对文件的处理,仅支持正则表达式,默认值为 `/eslint-loader/`。 + ### MpxWebpackPlugin.pluginLoader :::warning diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js index ba2462cfe3..c539615824 100644 --- a/packages/webpack-plugin/lib/template-compiler/compiler.js +++ b/packages/webpack-plugin/lib/template-compiler/compiler.js @@ -1795,7 +1795,7 @@ function processRootViewStyleClassHack (el, options, root) { // 有virtualHost情况wx组件注入virtualHost。无virtualHost阿里组件注入root-view。其他跳过。 function getVirtualHostRoot (options, meta) { - if (options.isComponent) { + if (srcMode === 'wx' && options.isComponent) { // 处理组件时 if (mode === 'wx' && options.hasVirtualHost) { // wx组件注入virtualHost配置 From 70ae471d721b11710d309b9efeaac96e4eccb51a Mon Sep 17 00:00:00 2001 From: xuegan Date: Fri, 20 Oct 2023 15:13:56 +0800 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E5=88=A0=E9=99=A4=E9=94=99=E8=AF=AF?= =?UTF-8?q?=E6=B3=A8=E9=87=8A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/webpack-plugin/lib/template-compiler/compiler.js | 1 - 1 file changed, 1 deletion(-) diff --git a/packages/webpack-plugin/lib/template-compiler/compiler.js b/packages/webpack-plugin/lib/template-compiler/compiler.js index c539615824..ae00c3bda3 100644 --- a/packages/webpack-plugin/lib/template-compiler/compiler.js +++ b/packages/webpack-plugin/lib/template-compiler/compiler.js @@ -1810,7 +1810,6 @@ function getVirtualHostRoot (options, meta) { value: `${MPX_ROOT_VIEW} host-${options.moduleId}` } ]) - // 添加时间处理 processElement(rootView, rootView, options, meta) return rootView }