fix: 修复升级到3.4后的异常

AntmJS · Feb 11, 2022 · 922300c · 922300c
1 parent 827ee52
commit 922300c
Show file tree

Hide file tree

Showing 25 changed files with 1,889 additions and 1,386 deletions.
diff --git a/packages/react-demo/package.json b/packages/react-demo/package.json
@@ -7,8 +7,8 @@
     "@babel/core": "7.12.3",
     "@pmmmwh/react-refresh-webpack-plugin": "0.4.3",
     "@svgr/webpack": "5.5.0",
-    "@tarojs/components": "3.3.19",
-    "@tarojs/taro": "^3.3.19",
+    "@tarojs/components": "3.4.1",
+    "@tarojs/taro": "^3.4.1",
     "@testing-library/jest-dom": "^5.11.4",
     "@testing-library/react": "^11.1.0",
     "@testing-library/user-event": "^12.1.10",
@@ -79,7 +79,7 @@
     "babel-plugin-import": "^1.13.3",
     "less": "^4.1.2",
     "less-loader": "7.3.0",
-    "postcss-pxtransform": "3.3.19"
+    "postcss-pxtransform": "3.4.1"
   },
   "jest": {
     "roots": [

diff --git a/packages/react-demo/src/index.js b/packages/react-demo/src/index.js
@@ -1,4 +1,5 @@
 import { defineCustomElements, applyPolyfills } from '@tarojs/components/loader'
+
 import { init } from '@antmjs/vantui'
 import React from 'react'
 import { render } from 'react-dom'

diff --git a/packages/react-demo/yarn.lock b/packages/react-demo/yarn.lock
diff --git a/packages/vantui-demo/.eslintignore b/packages/vantui-demo/.eslintignore
@@ -32,3 +32,4 @@ swan
 tt
 qq
 h5
+kwai
diff --git a/packages/vantui-demo/.prettierignore b/packages/vantui-demo/.prettierignore
@@ -27,3 +27,4 @@ swan
 tt
 qq
 h5
+kwai
diff --git a/packages/vantui-demo/.stylelintignore b/packages/vantui-demo/.stylelintignore
@@ -33,3 +33,4 @@ swan
 tt
 qq
 h5
+kwai
diff --git a/packages/vantui-demo/config/index.js b/packages/vantui-demo/config/index.js
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-const npath = require('path')
+const path = require('path')
 const pkg = require('../package.json')
 const miniChain = require('./webpack/miniChain')
 const h5Chain = require('./webpack/h5Chain')
@@ -34,17 +34,30 @@ let config = {
     DEPLOY_VERSION: JSON.stringify(version),
   },
   alias: {
-    '@': npath.resolve(process.cwd(), 'src'),
-    react: npath.resolve(process.cwd(), './node_modules/react'),
+    '@': path.resolve(process.cwd(), 'src'),
+    react: path.resolve(process.cwd(), './node_modules/react'),
   },
   framework: 'react',
   mini: {
     webpackChain(chain) {
       miniChain(chain)
     },
-    // lessLoaderOption: {
-    //   additionalData: "@import '~/src/style/index.less';",
-    // },
+    lessLoaderOption: {
+      lessOptions: {
+        modifyVars: {
+          hack: `true; @import "${path.join(
+            process.cwd(),
+            'src/style/index.less',
+          )}";${
+            process.env.TARO_ENV === 'kwai'
+              ? `@import "${path.join(process.cwd(), 'src/style/kwai.less')}";`
+              : ''
+          }`,
+        },
+      },
+      // 适用于全局引入样式
+      // additionalData: "@import '~/src/style/index.less';",
+    },
     postcss: {
       autoprefixer: {
         enable: true,
@@ -76,15 +89,15 @@ let config = {
         chain.mode('production')
         chain.devtool('hidden-source-map')
         chain.output
-          .path(npath.resolve('./build'))
+          .path(path.resolve('./build'))
           .filename('assets/js/[name].js')
           .chunkFilename('assets/js/chunk/[name].js')
           .publicPath(publicPath.replace('VERSION', version))
       } else {
         chain.mode('development')
         chain.devtool('eval-cheap-module-source-map')
         chain.output
-          .path(npath.resolve('./build'))
+          .path(path.resolve('./build'))
           .filename('assets/js/[name].js')
           .chunkFilename('assets/js/chunk/[name].js')
           .publicPath(publicPath.replace('VERSION', version))
@@ -109,9 +122,18 @@ let config = {
     },
     esnextModules: [/@antmjs[\\/]vantui/],
     proxy: {},
-    // lessLoaderOption: {
-    //   additionalData: "@import '~/src/style/index.less';",
-    // },
+    lessLoaderOption: {
+      lessOptions: {
+        modifyVars: {
+          hack: `true; @import "${path.join(
+            process.cwd(),
+            'src/style/index.less',
+          )}";`,
+        },
+      },
+      // 适用于全局引入样式
+      // additionalData: "@import '~/src/style/index.less';",
+    },
     postcss: {
       autoprefixer: {
         enable: true,
@@ -139,7 +161,8 @@ let config = {
   },
   plugins: [
     '@tarojs/plugin-platform-alipay-dd',
-    [npath.join(process.cwd(), 'config/webpack/configPlugin')],
+    '@tarojs/plugin-platform-kwai',
+    [path.join(process.cwd(), 'config/webpack/configPlugin')],
   ],
 }
 

diff --git a/packages/vantui-demo/config/webpack/configPlugin.js b/packages/vantui-demo/config/webpack/configPlugin.js
@@ -1,86 +1,75 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 const path = require('path')
 
-const configName = {
-  weapp: {
-    srcConfigName: 'project.weapp.json',
-    distConfigName: 'project.config.json',
-  },
-  alipay: {
-    srcConfigName: 'project.alipay.json',
-    distConfigName: 'mini.project.json',
-  },
-  tt: {
-    srcConfigName: 'project.tt.json',
-    distConfigName: 'project.config.json',
-  },
-  dd: {
-    srcConfigName: 'project.dd.json',
-    distConfigName: 'mini.project.json',
-  },
-}
-
 module.exports = function (ctx) {
-  ctx.onBuildFinish(() => {
-    if (process.env.TARO_ENV !== 'h5') {
-      const { appPath, sourcePath, outputPath } = ctx.paths
-      const { printLog, processTypeEnum, fs } = ctx.helper
-      const pkg = fs.readJSONSync(path.resolve(process.cwd(), './package.json'))
-      const srcConfigName =
-        configName[ctx.initialConfig.outputRoot].srcConfigName
-      const distConfigName =
-        configName[ctx.initialConfig.outputRoot].distConfigName
+  ctx.registerMethod(
+    'generateProjectConfig',
+    ({ srcConfigName, distConfigName }) => {
+      // 混合模式不需要生成项目配置
+      const { blended } = ctx.runOpts
+      if (blended) return
+
+      if (process.env.TARO_ENV !== 'h5') {
+        const { appPath, sourcePath, outputPath } = ctx.paths
+        const { printLog, processTypeEnum, fs } = ctx.helper
+        const pkg = fs.readJSONSync(
+          path.resolve(process.cwd(), './package.json'),
+        )
 
-      if (fs.existsSync(`${outputPath}/${distConfigName}`)) {
-        if (process.env.TARO_ENV === 'tt') {
-          const origProjectConfig = fs.readJSONSync(
-            `${outputPath}/${distConfigName}`,
-          )
-          if (origProjectConfig.appid) return
-        } else {
-          return
+        if (fs.existsSync(`${outputPath}/${distConfigName}`)) {
+          if (process.env.TARO_ENV === 'tt') {
+            const origProjectConfig = fs.readJSONSync(
+              `${outputPath}/${distConfigName}`,
+            )
+            if (origProjectConfig.appid) return
+          } else {
+            return
+          }
         }
-      }
 
-      // 生成 project.config.json
-      const projectConfigFileName = srcConfigName
-      let projectConfigPath = path.join(appPath, projectConfigFileName)
-      if (!fs.existsSync(projectConfigPath)) {
-        // 若项目根目录不存在对应平台的 projectConfig 文件，则尝试从源代码目录查找
-        projectConfigPath = path.join(sourcePath, projectConfigFileName)
-        if (!fs.existsSync(projectConfigPath)) return
-      }
+        // 生成 project.config.json
+        const projectConfigFileName = srcConfigName
+        let projectConfigPath = path.join(appPath, projectConfigFileName)
+        if (!fs.existsSync(projectConfigPath)) {
+          // 若项目根目录不存在对应平台的 projectConfig 文件，则尝试从源代码目录查找
+          projectConfigPath = path.join(sourcePath, projectConfigFileName)
+          if (!fs.existsSync(projectConfigPath)) return
+        }
 
-      const origProjectConfig = fs.readJSONSync(projectConfigPath)
-      // compileType 是 plugin 时不修改 miniprogramRoot 字段
-      let distProjectConfig = origProjectConfig
-      if (origProjectConfig.compileType !== 'plugin') {
-        distProjectConfig = Object.assign({}, origProjectConfig, {
-          miniprogramRoot: './',
-        })
-        if (
-          ctx.initialConfig.outputRoot === 'weapp' ||
-          ctx.initialConfig.outputRoot === 'tt'
-        ) {
-          distProjectConfig.appid =
-            pkg.appId[ctx.initialConfig.outputRoot][process.env.API_ENV]
+        const origProjectConfig = fs.readJSONSync(projectConfigPath)
+        // compileType 是 plugin 时不修改 miniprogramRoot 字段
+        let distProjectConfig = origProjectConfig
+        if (origProjectConfig.compileType !== 'plugin') {
+          distProjectConfig = Object.assign({}, origProjectConfig, {
+            miniprogramRoot: './',
+          })
           if (
-            process.env.API_ENV === 'dev' ||
-            process.env.API_ENV === 'stable'
+            ctx.initialConfig.outputRoot === 'weapp' ||
+            ctx.initialConfig.outputRoot === 'qq' ||
+            ctx.initialConfig.outputRoot === 'kwai' ||
+            ctx.initialConfig.outputRoot === 'swan' ||
+            ctx.initialConfig.outputRoot === 'tt'
           ) {
-            distProjectConfig.setting.urlCheck = false
+            distProjectConfig.appid =
+              pkg.appId[ctx.initialConfig.outputRoot][process.env.API_ENV]
+            if (
+              process.env.API_ENV === 'dev' ||
+              process.env.API_ENV === 'stable'
+            ) {
+              distProjectConfig.setting.urlCheck = false
+            }
           }
         }
+        ctx.writeFileToDist({
+          filePath: distConfigName,
+          content: JSON.stringify(distProjectConfig, null, 2),
+        })
+        printLog(
+          processTypeEnum.GENERATE,
+          '工具配置',
+          `${outputPath}/${distConfigName}`,
+        )
       }
-      ctx.writeFileToDist({
-        filePath: distConfigName,
-        content: JSON.stringify(distProjectConfig, null, 2),
-      })
-      printLog(
-        processTypeEnum.GENERATE,
-        '工具配置',
-        `${outputPath}/${distConfigName}`,
-      )
-    }
-  })
+    },
+  )
 }
diff --git a/packages/vantui-demo/config/webpack/globalLoader.js b/packages/vantui-demo/config/webpack/globalLoader.js
@@ -1,7 +1,11 @@
 // Taro不支持改编译中文件的插件HOOK，先用loader解决
 module.exports = function (source) {
   let newSource = source
-  if (process.env.TARO_ENV === 'alipay' || process.env.TARO_ENV === 'dd') {
+  if (
+    process.env.TARO_ENV === 'alipay' ||
+    process.env.TARO_ENV === 'dd' ||
+    process.env.TARO_ENV === 'swan'
+  ) {
     newSource = newSource.replace(
       'module.exports = g;',
       `

diff --git a/packages/vantui-demo/config/webpack/h5Chain.js b/packages/vantui-demo/config/webpack/h5Chain.js
@@ -7,13 +7,21 @@ module.exports = function (chain) {
   chain.module
     .rule('script')
     .exclude.clear()
-    .add((filename) => /node_modules/.test(filename))
+    .add(
+      (filename) =>
+        /css-loader/.test(filename) ||
+        (/node_modules/.test(filename) &&
+          !(
+            /taro/.test(filename) &&
+            !/tarojs[\\/](runtime|shared)/.test(filename)
+          )),
+    )
   // node_modules需要二次编译的在这里处理，taro相关的包不能加载polyfill
   chain.module
     .rule('compile-node-modules')
-    .test(/node_modules[\\/]@tarojs(.+?)\.[tj]sx?$/i)
+    .test(/tarojs[\\/](runtime|shared)/i)
     .use('taro-loader')
-    .loader(npath.join(process.cwd(), 'node_modules/babel-loader/lib/index.js'))
+    .loader(require.resolve('babel-loader'))
     .options({
       presets: [
         [

diff --git a/packages/vantui-demo/config/webpack/miniChain.js b/packages/vantui-demo/config/webpack/miniChain.js
@@ -15,13 +15,21 @@ module.exports = function (chain) {
   chain.module
     .rule('script')
     .exclude.clear()
-    .add((filename) => /node_modules/.test(filename))
+    .add(
+      (filename) =>
+        /css-loader/.test(filename) ||
+        (/node_modules/.test(filename) &&
+          !(
+            /taro/.test(filename) &&
+            !/tarojs[\\/](runtime|shared)/.test(filename)
+          )),
+    )
   // node_modules需要二次编译的在这里处理，taro相关的包不能加载polyfill
   chain.module
     .rule('compile-node-modules')
-    .test(/node_modules[\\/]@tarojs(.+?)\.[tj]sx?$/i)
+    .test(/tarojs[\\/](runtime|shared)/i)
     .use('taro-loader')
-    .loader(npath.join(process.cwd(), 'node_modules/babel-loader/lib/index.js'))
+    .loader(require.resolve('babel-loader'))
     .options({
       presets: [
         [

diff --git a/packages/vantui-demo/global.d.ts b/packages/vantui-demo/global.d.ts
@@ -15,17 +15,7 @@ declare module '*.styl'
 declare namespace NodeJS {
   interface ProcessEnv {
     NODE_ENV: 'production' | 'development'
-    TARO_ENV:
-      | 'weapp'
-      | 'swan'
-      | 'alipay'
-      | 'h5'
-      | 'tt'
-      | 'qq'
-      | 'dd'
-      | 'qywx'
-      | 'jd'
-      | 'iot'
+    TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'tt' | 'qq' | 'dd' | 'kwai'
     API_ENV: 'stable' | 'real' | 'pre' | 'dev'
     WATCHING: 'true' | 'false'
     DEPLOY_VERSION: string