@modern-js/plugin-tailwindcss 0.0.0-next-20221130140620 → 0.0.0-next-20221202032240

package/CHANGELOG.md

@@ -1,14 +1,14 @@
 # @modern-js/plugin-tailwindcss
 
-## 0.0.0-next-20221130140620
+## 0.0.0-next-20221202032240
 
 ### Major Changes
 
-- dda38c9c3: chore: v2
+- dda38c9c3e: chore: v2
 
 ### Minor Changes
 
-- 92f0eade3: feat:
+- 92f0eade39: feat:
 
   1. add style config and add new hook
   2. add dts alias logic
@@ -24,7 +24,7 @@
   4. 添加日志逻辑
   5. 添加 skipDeps 配置
 
-- 92f0eade3: feat:
+- 92f0eade39: feat:
 
   1. core: 增加 test 函数
   2. module plugins: 增加 `babel`, `mainField`, `target` 插件
@@ -40,37 +40,39 @@
 
 ### Patch Changes
 
-- Updated dependencies [2344eb26e]
-- Updated dependencies [a11fcf8b5]
-- Updated dependencies [b18fa8f3e]
-- Updated dependencies [c9e800d39]
-- Updated dependencies [3e57f2bd5]
-- Updated dependencies [fbf5eed5a]
-- Updated dependencies [a2509bfbd]
-- Updated dependencies [e4357f185]
-- Updated dependencies [4369648ae]
-- Updated dependencies [92f0eade3]
-- Updated dependencies [92c099446]
-- Updated dependencies [edd1cfb1a]
-- Updated dependencies [cc971eabf]
-- Updated dependencies [5b9049f2e]
-- Updated dependencies [6bda14ed7]
-- Updated dependencies [92004d190]
-- Updated dependencies [b8bbe036c]
-- Updated dependencies [40ed5874c]
-- Updated dependencies [60d537863]
-- Updated dependencies [d5a31df78]
-- Updated dependencies [dda38c9c3]
-- Updated dependencies [8b8e1bb57]
-- Updated dependencies [3bbea92b2]
-- Updated dependencies [b710adb84]
-- Updated dependencies [18aaf4224]
-- Updated dependencies [fcace5b5b]
-- Updated dependencies [abf3421a7]
-- Updated dependencies [543be9558]
-- Updated dependencies [14b712da8]
-  - @modern-js/runtime@0.0.0-next-20221130140620
-  - @modern-js/utils@0.0.0-next-20221130140620
+- d6546ad916: add buildConfig style in module-tools-v2 and remove tools
+  在 module-tools-v2 里新增 buildConfig style 并删除 tools
+- Updated dependencies [2344eb26ed]
+- Updated dependencies [a11fcf8b50]
+- Updated dependencies [b18fa8f3ed]
+- Updated dependencies [c9e800d39a]
+- Updated dependencies [3e57f2bd58]
+- Updated dependencies [fbf5eed5aa]
+- Updated dependencies [a2509bfbdb]
+- Updated dependencies [e4357f1856]
+- Updated dependencies [4369648ae2]
+- Updated dependencies [92f0eade39]
+- Updated dependencies [92c0994468]
+- Updated dependencies [edd1cfb1af]
+- Updated dependencies [cc971eabfc]
+- Updated dependencies [5b9049f2e9]
+- Updated dependencies [6bda14ed71]
+- Updated dependencies [92004d1906]
+- Updated dependencies [b8bbe036c7]
+- Updated dependencies [40ed5874c6]
+- Updated dependencies [60d5378632]
+- Updated dependencies [d5a31df781]
+- Updated dependencies [dda38c9c3e]
+- Updated dependencies [8b8e1bb571]
+- Updated dependencies [3bbea92b2a]
+- Updated dependencies [b710adb843]
+- Updated dependencies [18aaf42249]
+- Updated dependencies [fcace5b5b9]
+- Updated dependencies [abf3421a75]
+- Updated dependencies [543be9558e]
+- Updated dependencies [14b712da84]
+  - @modern-js/runtime@0.0.0-next-20221202032240
+  - @modern-js/utils@0.0.0-next-20221202032240
 
 ## 2.0.0-beta.2
 

package/dist/js/modern/cli.js

@@ -1,8 +1,6 @@
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 import path from 'path';
 import { PLUGIN_SCHEMAS, fs, CONFIG_CACHE_DIR, globby, nanoid, slash } from '@modern-js/utils';
 import DesignTokenPlugin from "./design-token/cli";
@@ -53,38 +51,19 @@ export default (({
             // TODO: Add interface about postcss config
             // TODO: In module project, also is called, but should not be called.
             postcss: config => {
+              var _modernConfig$tools, _modernConfig$source;
               const modernConfig = api.useResolvedConfigContext();
-              if (!config.postcssOptions
-              // config.$$tools === 'module-tools'
-              ) {
-                if (Array.isArray(config.plugins)) {
-                  const tailwindConfig = getTailwindConfig(modernConfig, {
-                    pureConfig: {
-                      content: ['./src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx', './src/**/*.less', './src/**/*.css', './src/**/*.sass', './src/**/*.scss', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                    }
-                  });
-                  config.plugins.push(require('tailwindcss')(tailwindConfig));
-                } else {
-                  const tailwindConfig = getTailwindConfig(modernConfig, {
-                    pureConfig: {
-                      content: ['./src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx', './src/**/*.less', './src/**/*.css', './src/**/*.sass', './src/**/*.scss', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                    }
-                  });
-                  config.plugins = [require('tailwindcss')(tailwindConfig)];
+              const tailwindConfig = getTailwindConfig(modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig$tools = modernConfig.tools) === null || _modernConfig$tools === void 0 ? void 0 : _modernConfig$tools.tailwindcss, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig$source = modernConfig.source) === null || _modernConfig$source === void 0 ? void 0 : _modernConfig$source.designSystem, {
+                pureConfig: {
+                  content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
+                  // about storybook
+                  './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
                 }
+              });
+              if (Array.isArray(config.postcssOptions.plugins)) {
+                config.postcssOptions.plugins.push(require('tailwindcss')(tailwindConfig));
               } else {
-                const tailwindConfig = getTailwindConfig(modernConfig, {
-                  pureConfig: {
-                    content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
-                    // about storybook
-                    './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                  }
-                });
-                if (Array.isArray(config.postcssOptions.plugins)) {
-                  config.postcssOptions.plugins.push(require('tailwindcss')(tailwindConfig));
-                } else {
-                  config.postcssOptions.plugins = [require('tailwindcss')(tailwindConfig)];
-                }
+                config.postcssOptions.plugins = [require('tailwindcss')(tailwindConfig)];
               }
             },
             babel(config) {
@@ -118,6 +97,27 @@ export default (({
             }
           }
         };
+      },
+      beforeBuildTask({
+        config
+      }) {
+        const modernConfig = api.useResolvedConfigContext();
+        const {
+          designSystem
+        } = modernConfig;
+        const tailwindConfig = getTailwindConfig(config.style.tailwindCss, designSystem, {
+          pureConfig: {
+            content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
+            // about storybook
+            './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
+          }
+        });
+        if (Array.isArray(config.style.postcss.plugins)) {
+          config.style.postcss.plugins.push(require('tailwindcss')(tailwindConfig));
+        } else {
+          config.style.postcss.plugins = [require('tailwindcss')(tailwindConfig)];
+        }
+        return config;
       }
     };
   }

package/dist/js/modern/design-token/cli/index.js

@@ -1,8 +1,6 @@
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 import { lazyImport, PLUGIN_SCHEMAS, createRuntimeExportsUtils } from '@modern-js/utils';
 export default (({
   pluginName
@@ -14,9 +12,7 @@ export default (({
     let pluginsExportsUtils;
     const resolveConfig = lazyImport('tailwindcss/resolveConfig', require);
     const PLUGIN_IDENTIFIER = 'designToken';
-    const getDesignTokens = userConfig => {
-      var _userConfig$source;
-      const designSystem = (_userConfig$source = userConfig.source) === null || _userConfig$source === void 0 ? void 0 : _userConfig$source.designSystem;
+    const getDesignTokens = designSystem => {
       const tailwindcssConfig = {};
       tailwindcssConfig.theme = designSystem ? _objectSpread({}, designSystem) : {};
 
@@ -53,11 +49,11 @@ export default (({
         entrypoint,
         imports
       }) {
-        var _userConfig$source$de, _userConfig$source2;
+        var _userConfig$source$de, _userConfig$source;
         const userConfig = api.useResolvedConfigContext();
-        const designSystem = (_userConfig$source$de = (_userConfig$source2 = userConfig.source) === null || _userConfig$source2 === void 0 ? void 0 : _userConfig$source2.designSystem) !== null && _userConfig$source$de !== void 0 ? _userConfig$source$de : {};
+        const designSystem = (_userConfig$source$de = (_userConfig$source = userConfig.source) === null || _userConfig$source === void 0 ? void 0 : _userConfig$source.designSystem) !== null && _userConfig$source$de !== void 0 ? _userConfig$source$de : {};
         if (typeof designSystem === 'object' && designSystem.supportStyledComponents) {
-          const designTokens = getDesignTokens(userConfig);
+          const designTokens = getDesignTokens(userConfig.source.designSystem);
           imports.push({
             value: '@modern-js/runtime/plugins',
             specifiers: [{
@@ -77,9 +73,9 @@ export default (({
         entrypoint,
         plugins
       }) {
-        var _userConfig$source$de2, _userConfig$source3;
+        var _userConfig$source$de2, _userConfig$source2;
         const userConfig = api.useResolvedConfigContext();
-        const designSystem = (_userConfig$source$de2 = (_userConfig$source3 = userConfig.source) === null || _userConfig$source3 === void 0 ? void 0 : _userConfig$source3.designSystem) !== null && _userConfig$source$de2 !== void 0 ? _userConfig$source$de2 : {};
+        const designSystem = (_userConfig$source$de2 = (_userConfig$source2 = userConfig.source) === null || _userConfig$source2 === void 0 ? void 0 : _userConfig$source2.designSystem) !== null && _userConfig$source$de2 !== void 0 ? _userConfig$source$de2 : {};
         let useSCThemeProvider = true;
         if (designSystem) {
           // when designSystem exist, designToken.styledComponents`s default value is false.

package/dist/js/modern/design-token/runtime/plugin.js

@@ -1,8 +1,6 @@
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 import hoistNonReactStatics from 'hoist-non-react-statics';
 import React, { useContext } from 'react';
 import { jsx as _jsx } from "react/jsx-runtime";

package/dist/js/modern/tailwind.js

@@ -11,8 +11,7 @@ const getPureDesignSystemConfig = designSystemConfig => {
   delete pureDesignSystemConfig.supportStyledComponents;
   return pureDesignSystemConfig;
 };
-const getTailwindConfig = (config, option = {}) => {
-  var _config$tools, _ref, _designSystem;
+const getTailwindConfig = (tailwindcss, designSystem, option = {}) => {
   const purgeConfig = merge({
     // TODO: how the operating environment is determined
     enabled: process.env.NODE_ENV === 'production',
@@ -23,8 +22,8 @@ const getTailwindConfig = (config, option = {}) => {
   const defaultTailwindConfig = {
     purge: purgeConfig
   };
-  const tailwindConfig = applyOptionsChain(defaultTailwindConfig, ((_config$tools = config.tools) === null || _config$tools === void 0 ? void 0 : _config$tools.tailwindcss) || {});
-  const designSystem = getPureDesignSystemConfig((_ref = (_designSystem = config.designSystem) !== null && _designSystem !== void 0 ? _designSystem : config.source.designSystem) !== null && _ref !== void 0 ? _ref : {});
+  const tailwindConfig = applyOptionsChain(defaultTailwindConfig, tailwindcss || {});
+  const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
   const [exist, key] = checkIfExistNotAllowKeys(tailwindConfig);
   if (exist) {
     logger.error(`should not exist '${key}' on tools.tailwindcss, please remove it`);
@@ -33,7 +32,7 @@ const getTailwindConfig = (config, option = {}) => {
   }
 
   // Because there is no default theme configuration
-  tailwindConfig.theme = designSystem || {};
+  tailwindConfig.theme = designSystemConfig || {};
   return tailwindConfig;
 };
 export { getTailwindConfig };

package/dist/js/node/cli.js

@@ -12,9 +12,7 @@ var _utils2 = require("./utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 const supportCssInJsLibrary = 'styled-components';
 const getRandomTwConfigFileName = internalDirectory => {
   return (0, _utils.slash)(_path.default.join(internalDirectory, `tailwind.config.${Date.now()}.${(0, _utils.nanoid)()}.js`));
@@ -61,38 +59,19 @@ var _default = ({
             // TODO: Add interface about postcss config
             // TODO: In module project, also is called, but should not be called.
             postcss: config => {
+              var _modernConfig$tools, _modernConfig$source;
               const modernConfig = api.useResolvedConfigContext();
-              if (!config.postcssOptions
-              // config.$$tools === 'module-tools'
-              ) {
-                if (Array.isArray(config.plugins)) {
-                  const tailwindConfig = (0, _tailwind.getTailwindConfig)(modernConfig, {
-                    pureConfig: {
-                      content: ['./src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx', './src/**/*.less', './src/**/*.css', './src/**/*.sass', './src/**/*.scss', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                    }
-                  });
-                  config.plugins.push(require('tailwindcss')(tailwindConfig));
-                } else {
-                  const tailwindConfig = (0, _tailwind.getTailwindConfig)(modernConfig, {
-                    pureConfig: {
-                      content: ['./src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx', './src/**/*.less', './src/**/*.css', './src/**/*.sass', './src/**/*.scss', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                    }
-                  });
-                  config.plugins = [require('tailwindcss')(tailwindConfig)];
+              const tailwindConfig = (0, _tailwind.getTailwindConfig)(modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig$tools = modernConfig.tools) === null || _modernConfig$tools === void 0 ? void 0 : _modernConfig$tools.tailwindcss, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig$source = modernConfig.source) === null || _modernConfig$source === void 0 ? void 0 : _modernConfig$source.designSystem, {
+                pureConfig: {
+                  content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
+                  // about storybook
+                  './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
                 }
+              });
+              if (Array.isArray(config.postcssOptions.plugins)) {
+                config.postcssOptions.plugins.push(require('tailwindcss')(tailwindConfig));
               } else {
-                const tailwindConfig = (0, _tailwind.getTailwindConfig)(modernConfig, {
-                  pureConfig: {
-                    content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
-                    // about storybook
-                    './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                  }
-                });
-                if (Array.isArray(config.postcssOptions.plugins)) {
-                  config.postcssOptions.plugins.push(require('tailwindcss')(tailwindConfig));
-                } else {
-                  config.postcssOptions.plugins = [require('tailwindcss')(tailwindConfig)];
-                }
+                config.postcssOptions.plugins = [require('tailwindcss')(tailwindConfig)];
               }
             },
             babel(config) {
@@ -126,6 +105,27 @@ var _default = ({
             }
           }
         };
+      },
+      beforeBuildTask({
+        config
+      }) {
+        const modernConfig = api.useResolvedConfigContext();
+        const {
+          designSystem
+        } = modernConfig;
+        const tailwindConfig = (0, _tailwind.getTailwindConfig)(config.style.tailwindCss, designSystem, {
+          pureConfig: {
+            content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
+            // about storybook
+            './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
+          }
+        });
+        if (Array.isArray(config.style.postcss.plugins)) {
+          config.style.postcss.plugins.push(require('tailwindcss')(tailwindConfig));
+        } else {
+          config.style.postcss.plugins = [require('tailwindcss')(tailwindConfig)];
+        }
+        return config;
       }
     };
   }

package/dist/js/node/design-token/cli/index.js

@@ -7,9 +7,7 @@ exports.default = void 0;
 var _utils = require("@modern-js/utils");
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 var _default = ({
   pluginName
 } = {
@@ -20,9 +18,7 @@ var _default = ({
     let pluginsExportsUtils;
     const resolveConfig = (0, _utils.lazyImport)('tailwindcss/resolveConfig', require);
     const PLUGIN_IDENTIFIER = 'designToken';
-    const getDesignTokens = userConfig => {
-      var _userConfig$source;
-      const designSystem = (_userConfig$source = userConfig.source) === null || _userConfig$source === void 0 ? void 0 : _userConfig$source.designSystem;
+    const getDesignTokens = designSystem => {
       const tailwindcssConfig = {};
       tailwindcssConfig.theme = designSystem ? _objectSpread({}, designSystem) : {};
 
@@ -59,11 +55,11 @@ var _default = ({
         entrypoint,
         imports
       }) {
-        var _userConfig$source$de, _userConfig$source2;
+        var _userConfig$source$de, _userConfig$source;
         const userConfig = api.useResolvedConfigContext();
-        const designSystem = (_userConfig$source$de = (_userConfig$source2 = userConfig.source) === null || _userConfig$source2 === void 0 ? void 0 : _userConfig$source2.designSystem) !== null && _userConfig$source$de !== void 0 ? _userConfig$source$de : {};
+        const designSystem = (_userConfig$source$de = (_userConfig$source = userConfig.source) === null || _userConfig$source === void 0 ? void 0 : _userConfig$source.designSystem) !== null && _userConfig$source$de !== void 0 ? _userConfig$source$de : {};
         if (typeof designSystem === 'object' && designSystem.supportStyledComponents) {
-          const designTokens = getDesignTokens(userConfig);
+          const designTokens = getDesignTokens(userConfig.source.designSystem);
           imports.push({
             value: '@modern-js/runtime/plugins',
             specifiers: [{
@@ -83,9 +79,9 @@ var _default = ({
         entrypoint,
         plugins
       }) {
-        var _userConfig$source$de2, _userConfig$source3;
+        var _userConfig$source$de2, _userConfig$source2;
         const userConfig = api.useResolvedConfigContext();
-        const designSystem = (_userConfig$source$de2 = (_userConfig$source3 = userConfig.source) === null || _userConfig$source3 === void 0 ? void 0 : _userConfig$source3.designSystem) !== null && _userConfig$source$de2 !== void 0 ? _userConfig$source$de2 : {};
+        const designSystem = (_userConfig$source$de2 = (_userConfig$source2 = userConfig.source) === null || _userConfig$source2 === void 0 ? void 0 : _userConfig$source2.designSystem) !== null && _userConfig$source$de2 !== void 0 ? _userConfig$source$de2 : {};
         let useSCThemeProvider = true;
         if (designSystem) {
           // when designSystem exist, designToken.styledComponents`s default value is false.

package/dist/js/node/design-token/runtime/plugin.js

@@ -12,9 +12,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 const DesignTokenContext = /*#__PURE__*/_react.default.createContext({});
 exports.DesignTokenContext = DesignTokenContext;
 const useDesignTokens = () => (0, _react.useContext)(DesignTokenContext);

package/dist/js/node/tailwind.js

@@ -17,8 +17,7 @@ const getPureDesignSystemConfig = designSystemConfig => {
   delete pureDesignSystemConfig.supportStyledComponents;
   return pureDesignSystemConfig;
 };
-const getTailwindConfig = (config, option = {}) => {
-  var _config$tools, _ref, _designSystem;
+const getTailwindConfig = (tailwindcss, designSystem, option = {}) => {
   const purgeConfig = (0, _lodash.merge)({
     // TODO: how the operating environment is determined
     enabled: process.env.NODE_ENV === 'production',
@@ -29,8 +28,8 @@ const getTailwindConfig = (config, option = {}) => {
   const defaultTailwindConfig = {
     purge: purgeConfig
   };
-  const tailwindConfig = (0, _utils.applyOptionsChain)(defaultTailwindConfig, ((_config$tools = config.tools) === null || _config$tools === void 0 ? void 0 : _config$tools.tailwindcss) || {});
-  const designSystem = getPureDesignSystemConfig((_ref = (_designSystem = config.designSystem) !== null && _designSystem !== void 0 ? _designSystem : config.source.designSystem) !== null && _ref !== void 0 ? _ref : {});
+  const tailwindConfig = (0, _utils.applyOptionsChain)(defaultTailwindConfig, tailwindcss || {});
+  const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
   const [exist, key] = checkIfExistNotAllowKeys(tailwindConfig);
   if (exist) {
     _utils.logger.error(`should not exist '${key}' on tools.tailwindcss, please remove it`);
@@ -39,7 +38,7 @@ const getTailwindConfig = (config, option = {}) => {
   }
 
   // Because there is no default theme configuration
-  tailwindConfig.theme = designSystem || {};
+  tailwindConfig.theme = designSystemConfig || {};
   return tailwindConfig;
 };
 exports.getTailwindConfig = getTailwindConfig;

package/dist/js/treeshaking/cli.js

@@ -57,38 +57,19 @@ export default (function () {
                         // TODO: Add interface about postcss config
                         // TODO: In module project, also is called, but should not be called.
                         postcss: function postcss(config) {
+                          var _modernConfig$tools, _modernConfig$source;
                           var modernConfig = api.useResolvedConfigContext();
-                          if (!config.postcssOptions
-                          // config.$$tools === 'module-tools'
-                          ) {
-                            if (Array.isArray(config.plugins)) {
-                              var tailwindConfig = getTailwindConfig(modernConfig, {
-                                pureConfig: {
-                                  content: ['./src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx', './src/**/*.less', './src/**/*.css', './src/**/*.sass', './src/**/*.scss', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                                }
-                              });
-                              config.plugins.push(require('tailwindcss')(tailwindConfig));
-                            } else {
-                              var _tailwindConfig = getTailwindConfig(modernConfig, {
-                                pureConfig: {
-                                  content: ['./src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx', './src/**/*.less', './src/**/*.css', './src/**/*.sass', './src/**/*.scss', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                                }
-                              });
-                              config.plugins = [require('tailwindcss')(_tailwindConfig)];
+                          var tailwindConfig = getTailwindConfig(modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig$tools = modernConfig.tools) === null || _modernConfig$tools === void 0 ? void 0 : _modernConfig$tools.tailwindcss, modernConfig === null || modernConfig === void 0 ? void 0 : (_modernConfig$source = modernConfig.source) === null || _modernConfig$source === void 0 ? void 0 : _modernConfig$source.designSystem, {
+                            pureConfig: {
+                              content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
+                              // about storybook
+                              './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
                             }
+                          });
+                          if (Array.isArray(config.postcssOptions.plugins)) {
+                            config.postcssOptions.plugins.push(require('tailwindcss')(tailwindConfig));
                           } else {
-                            var _tailwindConfig2 = getTailwindConfig(modernConfig, {
-                              pureConfig: {
-                                content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
-                                // about storybook
-                                './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
-                              }
-                            });
-                            if (Array.isArray(config.postcssOptions.plugins)) {
-                              config.postcssOptions.plugins.push(require('tailwindcss')(_tailwindConfig2));
-                            } else {
-                              config.postcssOptions.plugins = [require('tailwindcss')(_tailwindConfig2)];
-                            }
+                            config.postcssOptions.plugins = [require('tailwindcss')(tailwindConfig)];
                           }
                         },
                         babel: function babel(config) {
@@ -122,6 +103,24 @@ export default (function () {
                         }
                       }
                     };
+                  },
+                  beforeBuildTask: function beforeBuildTask(_ref2) {
+                    var config = _ref2.config;
+                    var modernConfig = api.useResolvedConfigContext();
+                    var designSystem = modernConfig.designSystem;
+                    var tailwindConfig = getTailwindConfig(config.style.tailwindCss, designSystem, {
+                      pureConfig: {
+                        content: ['./config/html/**/*.html', './config/html/**/*.ejs', './config/html/**/*.hbs', './src/**/*.js', './src/**/*.jsx', './src/**/*.ts', './src/**/*.tsx',
+                        // about storybook
+                        './storybook/**/*', './styles/**/*.less', './styles/**/*.css', './styles/**/*.sass', './styles/**/*.scss']
+                      }
+                    });
+                    if (Array.isArray(config.style.postcss.plugins)) {
+                      config.style.postcss.plugins.push(require('tailwindcss')(tailwindConfig));
+                    } else {
+                      config.style.postcss.plugins = [require('tailwindcss')(tailwindConfig)];
+                    }
+                    return config;
                   }
                 });
               case 6:

package/dist/js/treeshaking/design-token/cli/index.js

@@ -12,9 +12,7 @@ export default (function () {
       var pluginsExportsUtils;
       var resolveConfig = lazyImport('tailwindcss/resolveConfig', require);
       var PLUGIN_IDENTIFIER = 'designToken';
-      var getDesignTokens = function getDesignTokens(userConfig) {
-        var _userConfig$source;
-        var designSystem = (_userConfig$source = userConfig.source) === null || _userConfig$source === void 0 ? void 0 : _userConfig$source.designSystem;
+      var getDesignTokens = function getDesignTokens(designSystem) {
         var tailwindcssConfig = {};
         tailwindcssConfig.theme = designSystem ? _objectSpread({}, designSystem) : {};
 
@@ -48,13 +46,13 @@ export default (function () {
           };
         },
         modifyEntryImports: function modifyEntryImports(_ref2) {
-          var _userConfig$source$de, _userConfig$source2;
+          var _userConfig$source$de, _userConfig$source;
           var entrypoint = _ref2.entrypoint,
             imports = _ref2.imports;
           var userConfig = api.useResolvedConfigContext();
-          var designSystem = (_userConfig$source$de = (_userConfig$source2 = userConfig.source) === null || _userConfig$source2 === void 0 ? void 0 : _userConfig$source2.designSystem) !== null && _userConfig$source$de !== void 0 ? _userConfig$source$de : {};
+          var designSystem = (_userConfig$source$de = (_userConfig$source = userConfig.source) === null || _userConfig$source === void 0 ? void 0 : _userConfig$source.designSystem) !== null && _userConfig$source$de !== void 0 ? _userConfig$source$de : {};
           if (_typeof(designSystem) === 'object' && designSystem.supportStyledComponents) {
-            var designTokens = getDesignTokens(userConfig);
+            var designTokens = getDesignTokens(userConfig.source.designSystem);
             imports.push({
               value: '@modern-js/runtime/plugins',
               specifiers: [{
@@ -69,11 +67,11 @@ export default (function () {
           };
         },
         modifyEntryRuntimePlugins: function modifyEntryRuntimePlugins(_ref3) {
-          var _userConfig$source$de2, _userConfig$source3;
+          var _userConfig$source$de2, _userConfig$source2;
           var entrypoint = _ref3.entrypoint,
             plugins = _ref3.plugins;
           var userConfig = api.useResolvedConfigContext();
-          var designSystem = (_userConfig$source$de2 = (_userConfig$source3 = userConfig.source) === null || _userConfig$source3 === void 0 ? void 0 : _userConfig$source3.designSystem) !== null && _userConfig$source$de2 !== void 0 ? _userConfig$source$de2 : {};
+          var designSystem = (_userConfig$source$de2 = (_userConfig$source2 = userConfig.source) === null || _userConfig$source2 === void 0 ? void 0 : _userConfig$source2.designSystem) !== null && _userConfig$source$de2 !== void 0 ? _userConfig$source$de2 : {};
           var useSCThemeProvider = true;
           if (designSystem) {
             // when designSystem exist, designToken.styledComponents`s default value is false.

package/dist/js/treeshaking/tailwind.js

@@ -14,9 +14,8 @@ var getPureDesignSystemConfig = function getPureDesignSystemConfig(designSystemC
   delete pureDesignSystemConfig.supportStyledComponents;
   return pureDesignSystemConfig;
 };
-var getTailwindConfig = function getTailwindConfig(config) {
-  var _config$tools, _ref, _designSystem;
-  var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+var getTailwindConfig = function getTailwindConfig(tailwindcss, designSystem) {
+  var option = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   var purgeConfig = merge({
     // TODO: how the operating environment is determined
     enabled: process.env.NODE_ENV === 'production',
@@ -27,8 +26,8 @@ var getTailwindConfig = function getTailwindConfig(config) {
   var defaultTailwindConfig = {
     purge: purgeConfig
   };
-  var tailwindConfig = applyOptionsChain(defaultTailwindConfig, ((_config$tools = config.tools) === null || _config$tools === void 0 ? void 0 : _config$tools.tailwindcss) || {});
-  var designSystem = getPureDesignSystemConfig((_ref = (_designSystem = config.designSystem) !== null && _designSystem !== void 0 ? _designSystem : config.source.designSystem) !== null && _ref !== void 0 ? _ref : {});
+  var tailwindConfig = applyOptionsChain(defaultTailwindConfig, tailwindcss || {});
+  var designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
   var _checkIfExistNotAllow = checkIfExistNotAllowKeys(tailwindConfig),
     _checkIfExistNotAllow2 = _slicedToArray(_checkIfExistNotAllow, 2),
     exist = _checkIfExistNotAllow2[0],
@@ -40,7 +39,7 @@ var getTailwindConfig = function getTailwindConfig(config) {
   }
 
   // Because there is no default theme configuration
-  tailwindConfig.theme = designSystem || {};
+  tailwindConfig.theme = designSystemConfig || {};
   return tailwindConfig;
 };
 export { getTailwindConfig };

package/dist/types/cli.d.ts

@@ -1,8 +1,9 @@
-import type { LegacyAppTools, CliPlugin } from '@modern-js/app-tools';
+import type { LegacyAppTools } from '@modern-js/app-tools';
+import type { CliPlugin, ModuleTools } from '@modern-js/module-tools-v2';
 export declare const getRandomTwConfigFileName: (internalDirectory: string) => string;
 declare const _default: ({
   pluginName
 }?: {
   pluginName: string;
-}) => CliPlugin<LegacyAppTools>;
+}) => CliPlugin<LegacyAppTools & ModuleTools>;
 export default _default;

package/dist/types/tailwind.d.ts

@@ -1,5 +1,5 @@
-import type { AppLegacyNormalizedConfig } from '@modern-js/app-tools';
-declare const getTailwindConfig: (config: AppLegacyNormalizedConfig, option?: {
+import { DesignSystem, Tailwind } from './types';
+declare const getTailwindConfig: (tailwindcss?: Tailwind, designSystem?: DesignSystem, option?: {
   pureConfig?: Record<string, any>;
-}) => any;
+}) => Record<string, any>;
 export { getTailwindConfig };

package/dist/types/types.d.ts

@@ -1,10 +1,4 @@
-export type LegacyUserConfig = {
-  designSystem?: Record<string, any> & {
-    supportStyledComponents?: boolean;
-  };
-  source?: {
-    designSystem?: Record<string, any> & {
-      supportStyledComponents?: boolean;
-    };
-  };
-};
+export declare type DesignSystem = Record<string, any> & {
+  supportStyledComponents?: boolean;
+};
+export declare type Tailwind = Record<string, any> | ((options: Record<string, any>) => Record<string, any> | void);

package/package.json

@@ -11,7 +11,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "0.0.0-next-20221130140620",
+  "version": "0.0.0-next-20221202032240",
   "jsnext:source": "./src/index.ts",
   "types": "./dist/types/index.d.ts",
   "main": "./dist/js/node/index.js",
@@ -45,7 +45,7 @@
   "dependencies": {
     "@babel/runtime": "^7.18.0",
     "hoist-non-react-statics": "^3.3.2",
-    "@modern-js/utils": "0.0.0-next-20221130140620"
+    "@modern-js/utils": "0.0.0-next-20221202032240"
   },
   "devDependencies": {
     "@types/jest": "^27",
@@ -56,16 +56,17 @@
     "jest": "^27",
     "react": "^18",
     "postcss": "^8.4.14",
-    "@modern-js/core": "0.0.0-next-20221130140620",
-    "@modern-js/runtime": "0.0.0-next-20221130140620",
-    "@modern-js/types": "0.0.0-next-20221130140620",
-    "@scripts/build": "0.0.0-next-20221130140620",
-    "@modern-js/app-tools": "0.0.0-next-20221130140620",
-    "@scripts/jest-config": "0.0.0-next-20221130140620"
+    "@modern-js/core": "0.0.0-next-20221202032240",
+    "@modern-js/module-tools-v2": "0.0.0-next-20221202032240",
+    "@modern-js/runtime": "0.0.0-next-20221202032240",
+    "@modern-js/types": "0.0.0-next-20221202032240",
+    "@scripts/build": "0.0.0-next-20221202032240",
+    "@modern-js/app-tools": "0.0.0-next-20221202032240",
+    "@scripts/jest-config": "0.0.0-next-20221202032240"
   },
   "peerDependencies": {
     "tailwindcss": "^2.0.4",
-    "@modern-js/runtime": "0.0.0-next-20221130140620"
+    "@modern-js/runtime": "^0.0.0-next-20221202032240"
   },
   "peerDependenciesMeta": {
     "@modern-js/runtime": {