@oceanbase/codemod 0.2.9 → 0.2.10

package/README.md

@@ -1,6 +1,6 @@
 # OceanBase Codemod
 
-A collection of codemod scripts that help migrate from `antd`, `@alipay/ob-ui`, `@alipay/tech-ui`, `@ant-design/pro-components` and `@ant-design/charts` to OceanBase Design System by using [jscodeshift](https://github.com/facebook/jscodeshift) and [postcss](https://github.com/postcss/postcss). (Inspired by [@ant-design/codemod-v5](https://github.com/ant-design/codemod-v5))
+A collection of codemod transformers that help migrate from `antd`, `@alipay/ob-ui`, `@alipay/tech-ui`, `@ant-design/pro-components` and `@ant-design/charts` to OceanBase Design System by using [jscodeshift](https://github.com/facebook/jscodeshift) and [postcss](https://github.com/postcss/postcss). (Inspired by [@ant-design/codemod-v5](https://github.com/ant-design/codemod-v5))
 
 [![NPM version](https://img.shields.io/npm/v/@oceanbase/codemod.svg?style=flat)](https://npmjs.org/package/@oceanbase/codemod) [![NPM downloads](http://img.shields.io/npm/dm/@oceanbase/codemod.svg?style=flat)](https://npmjs.org/package/@oceanbase/codemod) [![Github Action](https://github.com/oceanbase/oceanbase-design/actions/workflows/ci.yml/badge.svg)](https://github.com/oceanbase/oceanbase-design/actions/workflows/ci.yml)
 
@@ -10,17 +10,24 @@ A collection of codemod scripts that help migrate from `antd`, `@alipay/ob-ui`,
 
 ## Usage
 
-Before run codemod scripts, you'd better make sure to commit your local git changes firstly.
+Before run codemod, you'd better make sure to commit your local git changes firstly.
 
 ```shell
 # Run directly through npx
 # `src` is the target directory or file that you want to transform.
 npx -p @oceanbase/codemod codemod src
 # options
-# --disablePrettier   // disable prettier
+# --transformer=t1,t2     // run specify transformers
+# --disablePrettier       // disable prettier
 ```
 
-## Codemod scripts introduction
+Run specific transformers:
+
+```shell
+npx -p @oceanbase/codemod codemod src --transformer=style-to-token,less-to-token
+```
+
+## Codemod transformers introduction
 
 ### `antd-to-oceanbase-design`
 

package/bin/cli.js

@@ -101,7 +101,10 @@ function getRunnerArgs(transformerPath, parser = 'babylon', options = {}) {
 }
 
 async function run(filePath, args = {}) {
-  for (const transformer of transformers) {
+  const targetTransformers =
+    args.transformer?.split(',')?.filter(transformer => transformers.includes(transformer)) ||
+    transformers;
+  for (const transformer of targetTransformers) {
     await transform(transformer, 'babylon', filePath, args);
   }
 }
@@ -250,9 +253,10 @@ async function upgradeDetect(targetDir, needOBCharts, needObUtil) {
 
 /**
  * options
- * --force             // force skip git checking (dangerously)
- * --cpus=1            // specify cpus cores to use
- * --disablePrettier   // disable prettier
+ * --force               // force skip git checking (dangerously)
+ * --cpus=1              // specify cpus cores to use
+ * --disablePrettier     // disable prettier
+ * --transformer=t1,t2   // specify target transformer
  */
 
 async function bootstrap() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oceanbase/codemod",
-  "version": "0.2.9",
+  "version": "0.2.10",
   "description": "Codemod for OceanBase Design upgrade",
   "keywords": [
     "oceanbase",
@@ -46,5 +46,5 @@
     "enzyme": "^3.11.0",
     "enzyme-to-json": "^3.6.2"
   },
-  "gitHead": "c9a4257a5c6357396e72c6a7acccd24613c4ceaf"
+  "gitHead": "debd02b577d782f8a403fe0f6133efb172168898"
 }

package/transforms/__testfixtures__/less-to-token/obui-less-token-to-token.input.less

@@ -0,0 +1,8 @@
+@import '~@alipay/ob-ui/es/theme/index.less';
+
+.container {
+  color: @colorInfo;
+  background: @colorSuccess;
+  background-color: @colorWarning;
+  border-color: @colorError;
+}

package/transforms/__testfixtures__/less-to-token/obui-less-token-to-token.output.less

@@ -0,0 +1,7 @@
+@import '~@oceanbase/design/es/theme/index.less';
+.container {
+  color: @colorInfo;
+  background: @colorSuccess;
+  background-color: @colorWarning;
+  border-color: @colorError;
+}

package/transforms/__tests__/less-to-token.test.ts

@@ -3,7 +3,13 @@ import path from 'path';
 import { transform } from '../less-to-token';
 
 const testUnit = 'less-to-token';
-const tests = ['antd-v4-less-to-token', 'obui-less-to-token', 'case-insensitive', 'mixin'];
+const tests = [
+  'antd-v4-less-to-token',
+  'obui-less-to-token',
+  'case-insensitive',
+  'mixin',
+  'obui-less-token-to-token',
+];
 
 describe(testUnit, () => {
   tests.forEach(test => {

package/transforms/less-to-token.js

@@ -37,14 +37,18 @@ async function transform(file) {
   const { root: ast } = await postcss([]).process(content, {
     syntax: postcssLess,
   });
-  let modified = false;
+  let hasToken = false;
   let tokenLessImported = false;
   // 遍历 AST
   ast.walk(node => {
-    const { key, token, formattedValue } = tokenParse(node.value);
-    if (node.type === 'decl' && token) {
-      node.value = formattedValue.replace(key, `@${token}`);
-      modified = true;
+    if (node.type === 'decl') {
+      const { key, token, formattedValue } = tokenParse(node.value);
+      if (token) {
+        node.value = formattedValue.replace(key, `@${token}`);
+        hasToken = true;
+      } else if (node.value?.includes('@')) {
+        hasToken = true;
+      }
     } else if (node.type === 'atrule' && node.name === 'import') {
       if (node.params === "'~@oceanbase/design/es/theme/index.less'") {
         tokenLessImported = true;
@@ -54,7 +58,7 @@ async function transform(file) {
     }
   });
   // prepend @import '~@oceanbase/design/es/theme/index.less';
-  if (modified && !tokenLessImported) {
+  if (hasToken && !tokenLessImported) {
     ast.prepend({
       name: 'import',
       params: "'~@oceanbase/design/es/theme/index.less'",