@modern-js/plugin-tailwindcss 2.32.1 → 2.33.0
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/CHANGELOG.md +22 -0
- package/dist/cjs/cli.js +22 -36
- package/dist/cjs/config.js +78 -0
- package/dist/cjs/design-token/cli/index.js +3 -3
- package/dist/cjs/macro.js +71 -0
- package/dist/cjs/utils.js +0 -52
- package/dist/esm/cli.js +25 -31
- package/dist/esm/config.js +93 -0
- package/dist/esm/design-token/cli/index.js +2 -3
- package/dist/esm/macro.js +49 -0
- package/dist/esm/utils.js +0 -46
- package/dist/esm-node/cli.js +19 -30
- package/dist/esm-node/config.js +59 -0
- package/dist/esm-node/design-token/cli/index.js +1 -1
- package/dist/esm-node/macro.js +45 -0
- package/dist/esm-node/utils.js +0 -42
- package/dist/types/cli.d.ts +0 -1
- package/dist/types/config.d.ts +20 -0
- package/dist/types/design-token/cli/index.d.ts +2 -3
- package/dist/types/macro.d.ts +4 -0
- package/dist/types/types.d.ts +3 -2
- package/dist/types/utils.d.ts +0 -3
- package/package.json +11 -10
- package/dist/cjs/tailwind.js +0 -39
- package/dist/esm/tailwind.js +0 -31
- package/dist/esm-node/tailwind.js +0 -30
- package/dist/types/tailwind.d.ts +0 -5
package/CHANGELOG.md
CHANGED
@@ -1,5 +1,27 @@
|
|
1
1
|
# @modern-js/plugin-tailwindcss
|
2
2
|
|
3
|
+
## 2.33.0
|
4
|
+
|
5
|
+
### Patch Changes
|
6
|
+
|
7
|
+
- fd2ca58: feat(plugin-tailwind): automatically read tailwind config file
|
8
|
+
|
9
|
+
feat(plugin-tailwind): 自动读取 tailwind config 文件
|
10
|
+
|
11
|
+
- bc1f8da: feat(builder): support custom logger in dev server
|
12
|
+
|
13
|
+
feat(builder): 支持自定义 logger
|
14
|
+
|
15
|
+
- Updated dependencies [6ea89ab]
|
16
|
+
- Updated dependencies [ae35c65]
|
17
|
+
- Updated dependencies [2bcff4f]
|
18
|
+
- Updated dependencies [fd82137]
|
19
|
+
- Updated dependencies [bc1f8da]
|
20
|
+
- Updated dependencies [44da57b]
|
21
|
+
- @modern-js/runtime@2.33.0
|
22
|
+
- @modern-js/utils@2.33.0
|
23
|
+
- @modern-js/node-bundle-require@2.33.0
|
24
|
+
|
3
25
|
## 2.32.1
|
4
26
|
|
5
27
|
### Patch Changes
|
package/dist/cjs/cli.js
CHANGED
@@ -10,9 +10,6 @@ function _export(target, all) {
|
|
10
10
|
});
|
11
11
|
}
|
12
12
|
_export(exports, {
|
13
|
-
getRandomTwConfigFileName: function() {
|
14
|
-
return getRandomTwConfigFileName;
|
15
|
-
},
|
16
13
|
tailwindcssPlugin: function() {
|
17
14
|
return tailwindcssPlugin;
|
18
15
|
},
|
@@ -23,55 +20,40 @@ _export(exports, {
|
|
23
20
|
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
24
21
|
const _path = /* @__PURE__ */ _interop_require_default._(require("path"));
|
25
22
|
const _utils = require("@modern-js/utils");
|
26
|
-
const _cli =
|
27
|
-
const
|
23
|
+
const _cli = require("./design-token/cli");
|
24
|
+
const _config = require("./config");
|
28
25
|
const _utils1 = require("./utils");
|
29
|
-
const
|
30
|
-
const getRandomTwConfigFileName = (internalDirectory) => {
|
31
|
-
return (0, _utils.slash)(_path.default.join(internalDirectory, `tailwind.config.${Date.now()}.${(0, _utils.nanoid)()}.js`));
|
32
|
-
};
|
33
|
-
function getDefaultContent(appDirectory) {
|
34
|
-
const defaultContent = [
|
35
|
-
"./src/**/*.{js,jsx,ts,tsx}"
|
36
|
-
];
|
37
|
-
if (_utils.fs.existsSync(_path.default.join(appDirectory, "storybook"))) {
|
38
|
-
defaultContent.push("./storybook/**/*");
|
39
|
-
}
|
40
|
-
if (_utils.fs.existsSync(_path.default.join(appDirectory, "config/html"))) {
|
41
|
-
defaultContent.push("./config/html/**/*.{html,ejs,hbs}");
|
42
|
-
}
|
43
|
-
return defaultContent;
|
44
|
-
}
|
26
|
+
const _macro = require("./macro");
|
45
27
|
const tailwindcssPlugin = ({ pluginName } = {
|
46
28
|
pluginName: "@modern-js/plugin-tailwindcss"
|
47
29
|
}) => ({
|
48
30
|
name: "@modern-js/plugin-tailwindcss",
|
49
31
|
// support designSystem.supportStyledComponents
|
50
32
|
usePlugins: [
|
51
|
-
(0, _cli.
|
33
|
+
(0, _cli.designTokenPlugin)({
|
52
34
|
pluginName
|
53
35
|
})
|
54
36
|
],
|
55
37
|
setup: async (api) => {
|
56
38
|
const { appDirectory, internalDirectory } = api.useAppContext();
|
57
39
|
let internalTwConfigPath = "";
|
58
|
-
const haveTwinMacro = await (0,
|
40
|
+
const haveTwinMacro = await (0, _macro.checkTwinMacroExist)(appDirectory);
|
59
41
|
const tailwindPath = (0, _utils1.getTailwindPath)(appDirectory);
|
60
42
|
const tailwindVersion = (0, _utils1.getTailwindVersion)(appDirectory);
|
61
|
-
const
|
43
|
+
const userTailwindConfig = await (0, _config.loadConfigFile)(appDirectory);
|
62
44
|
return {
|
63
45
|
prepare() {
|
64
46
|
if (haveTwinMacro) {
|
65
|
-
const twinMajorVersion = (0,
|
47
|
+
const twinMajorVersion = (0, _macro.getTwinMacroMajorVersion)(appDirectory);
|
66
48
|
const useConfigPath = twinMajorVersion && twinMajorVersion < 3;
|
67
49
|
if (useConfigPath) {
|
68
|
-
internalTwConfigPath = getRandomTwConfigFileName(internalDirectory);
|
50
|
+
internalTwConfigPath = (0, _macro.getRandomTwConfigFileName)(internalDirectory);
|
69
51
|
const globPattern = (0, _utils.slash)(_path.default.join(appDirectory, _utils.CONFIG_CACHE_DIR, "*.cjs"));
|
70
52
|
const files = _utils.globby.sync(globPattern, {
|
71
53
|
absolute: true
|
72
54
|
});
|
73
55
|
if (files.length > 0) {
|
74
|
-
_utils.fs.writeFileSync(internalTwConfigPath, (0,
|
56
|
+
_utils.fs.writeFileSync(internalTwConfigPath, (0, _macro.template)(files[files.length - 1]), "utf-8");
|
75
57
|
}
|
76
58
|
}
|
77
59
|
}
|
@@ -95,10 +77,12 @@ const tailwindcssPlugin = ({ pluginName } = {
|
|
95
77
|
if (!tailwindConfig) {
|
96
78
|
var _modernConfig_tools, _modernConfig, _modernConfig_source, _modernConfig1;
|
97
79
|
const modernConfig = api.useResolvedConfigContext();
|
98
|
-
tailwindConfig = (0,
|
99
|
-
|
100
|
-
|
101
|
-
|
80
|
+
tailwindConfig = (0, _config.getTailwindConfig)({
|
81
|
+
appDirectory,
|
82
|
+
tailwindVersion,
|
83
|
+
userConfig: userTailwindConfig,
|
84
|
+
extraConfig: (_modernConfig = modernConfig) === null || _modernConfig === void 0 ? void 0 : (_modernConfig_tools = _modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss,
|
85
|
+
designSystem: (_modernConfig1 = modernConfig) === null || _modernConfig1 === void 0 ? void 0 : (_modernConfig_source = _modernConfig1.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem
|
102
86
|
});
|
103
87
|
}
|
104
88
|
};
|
@@ -118,6 +102,7 @@ const tailwindcssPlugin = ({ pluginName } = {
|
|
118
102
|
}
|
119
103
|
},
|
120
104
|
babel: haveTwinMacro ? (_, { addPlugins }) => {
|
105
|
+
const supportCssInJsLibrary = "styled-components";
|
121
106
|
initTailwindConfig();
|
122
107
|
addPlugins([
|
123
108
|
[
|
@@ -136,11 +121,12 @@ const tailwindcssPlugin = ({ pluginName } = {
|
|
136
121
|
},
|
137
122
|
beforeBuildTask(config) {
|
138
123
|
const modernConfig = api.useResolvedConfigContext();
|
139
|
-
const
|
140
|
-
|
141
|
-
|
142
|
-
|
143
|
-
|
124
|
+
const tailwindConfig = (0, _config.getTailwindConfig)({
|
125
|
+
appDirectory,
|
126
|
+
tailwindVersion,
|
127
|
+
userConfig: userTailwindConfig,
|
128
|
+
extraConfig: config.style.tailwindcss,
|
129
|
+
designSystem: modernConfig.designSystem
|
144
130
|
});
|
145
131
|
const tailwindPlugin = require(tailwindPath)(tailwindConfig);
|
146
132
|
if (Array.isArray(config.style.postcss.plugins)) {
|
@@ -0,0 +1,78 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for (var name in all)
|
7
|
+
Object.defineProperty(target, name, {
|
8
|
+
enumerable: true,
|
9
|
+
get: all[name]
|
10
|
+
});
|
11
|
+
}
|
12
|
+
_export(exports, {
|
13
|
+
loadConfigFile: function() {
|
14
|
+
return loadConfigFile;
|
15
|
+
},
|
16
|
+
getTailwindConfig: function() {
|
17
|
+
return getTailwindConfig;
|
18
|
+
}
|
19
|
+
});
|
20
|
+
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
21
|
+
const _path = /* @__PURE__ */ _interop_require_default._(require("path"));
|
22
|
+
const _utils = require("@modern-js/utils");
|
23
|
+
const _lodash = require("@modern-js/utils/lodash");
|
24
|
+
const _nodebundlerequire = require("@modern-js/node-bundle-require");
|
25
|
+
function getDefaultContent(appDirectory) {
|
26
|
+
const defaultContent = [
|
27
|
+
"./src/**/*.{js,jsx,ts,tsx}"
|
28
|
+
];
|
29
|
+
if (_utils.fs.existsSync(_path.default.join(appDirectory, "storybook"))) {
|
30
|
+
defaultContent.push("./storybook/**/*");
|
31
|
+
}
|
32
|
+
if (_utils.fs.existsSync(_path.default.join(appDirectory, "config/html"))) {
|
33
|
+
defaultContent.push("./config/html/**/*.{html,ejs,hbs}");
|
34
|
+
}
|
35
|
+
return defaultContent;
|
36
|
+
}
|
37
|
+
const getPureDesignSystemConfig = (config) => {
|
38
|
+
const pureConfig = (0, _lodash.cloneDeep)(config);
|
39
|
+
delete pureConfig.supportStyledComponents;
|
40
|
+
return pureConfig;
|
41
|
+
};
|
42
|
+
const getV2PurgeConfig = (content) => ({
|
43
|
+
enabled: process.env.NODE_ENV === "production",
|
44
|
+
layers: [
|
45
|
+
"utilities"
|
46
|
+
],
|
47
|
+
content
|
48
|
+
});
|
49
|
+
async function loadConfigFile(appDirectory) {
|
50
|
+
const extensions = [
|
51
|
+
"ts",
|
52
|
+
"js",
|
53
|
+
"cjs",
|
54
|
+
"mjs"
|
55
|
+
];
|
56
|
+
const configs = extensions.map((ext) => _path.default.resolve(appDirectory, `tailwind.config.${ext}`));
|
57
|
+
const configFile = (0, _utils.findExists)(configs);
|
58
|
+
if (configFile) {
|
59
|
+
const mod = await (0, _nodebundlerequire.bundleRequire)(configFile);
|
60
|
+
return mod.default || mod;
|
61
|
+
}
|
62
|
+
return {};
|
63
|
+
}
|
64
|
+
const getTailwindConfig = ({ tailwindVersion, appDirectory, userConfig, extraConfig, designSystem }) => {
|
65
|
+
const content = getDefaultContent(appDirectory);
|
66
|
+
let tailwindConfig = tailwindVersion === "3" ? {
|
67
|
+
content
|
68
|
+
} : {
|
69
|
+
purge: getV2PurgeConfig(content)
|
70
|
+
};
|
71
|
+
Object.assign(tailwindConfig, userConfig);
|
72
|
+
tailwindConfig = extraConfig ? (0, _utils.applyOptionsChain)(tailwindConfig, extraConfig) : tailwindConfig;
|
73
|
+
const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
|
74
|
+
if (designSystemConfig && Object.keys(designSystemConfig).length > 0) {
|
75
|
+
tailwindConfig.theme = designSystemConfig;
|
76
|
+
}
|
77
|
+
return tailwindConfig;
|
78
|
+
};
|
@@ -2,14 +2,14 @@
|
|
2
2
|
Object.defineProperty(exports, "__esModule", {
|
3
3
|
value: true
|
4
4
|
});
|
5
|
-
Object.defineProperty(exports, "
|
5
|
+
Object.defineProperty(exports, "designTokenPlugin", {
|
6
6
|
enumerable: true,
|
7
7
|
get: function() {
|
8
|
-
return
|
8
|
+
return designTokenPlugin;
|
9
9
|
}
|
10
10
|
});
|
11
11
|
const _utils = require("@modern-js/utils");
|
12
|
-
const
|
12
|
+
const designTokenPlugin = ({ pluginName } = {
|
13
13
|
pluginName: "@modern-js/plugin-tailwindcss"
|
14
14
|
}) => ({
|
15
15
|
name: "@modern-js/plugin-design-token",
|
@@ -0,0 +1,71 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for (var name in all)
|
7
|
+
Object.defineProperty(target, name, {
|
8
|
+
enumerable: true,
|
9
|
+
get: all[name]
|
10
|
+
});
|
11
|
+
}
|
12
|
+
_export(exports, {
|
13
|
+
template: function() {
|
14
|
+
return template;
|
15
|
+
},
|
16
|
+
checkTwinMacroExist: function() {
|
17
|
+
return checkTwinMacroExist;
|
18
|
+
},
|
19
|
+
getTwinMacroMajorVersion: function() {
|
20
|
+
return getTwinMacroMajorVersion;
|
21
|
+
},
|
22
|
+
getRandomTwConfigFileName: function() {
|
23
|
+
return getRandomTwConfigFileName;
|
24
|
+
}
|
25
|
+
});
|
26
|
+
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
27
|
+
const _path = /* @__PURE__ */ _interop_require_default._(require("path"));
|
28
|
+
const _utils = require("@modern-js/utils");
|
29
|
+
const template = (configPath) => `
|
30
|
+
function _interopRequireDefault(obj) {
|
31
|
+
return obj && obj.__esModule ? obj : { default: obj };
|
32
|
+
}
|
33
|
+
const modernConfig = _interopRequireDefault(require('${configPath}')).default;
|
34
|
+
|
35
|
+
const theme =
|
36
|
+
modernConfig && modernConfig.source && modernConfig.source.designSystem
|
37
|
+
? modernConfig.source.designSystem
|
38
|
+
: {};
|
39
|
+
const tailwindcss =
|
40
|
+
modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss
|
41
|
+
? modernConfig.tools.tailwindcss
|
42
|
+
: {};
|
43
|
+
|
44
|
+
module.exports = {
|
45
|
+
theme,
|
46
|
+
...tailwindcss,
|
47
|
+
};
|
48
|
+
`;
|
49
|
+
const TWIN_MACRO_NAME = "twin.macro";
|
50
|
+
const checkTwinMacroExist = async (appDirectory) => {
|
51
|
+
const packageJson = await _utils.fs.readJSON(_path.default.join(appDirectory, "package.json"), {
|
52
|
+
throws: false
|
53
|
+
}) || {};
|
54
|
+
return Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]);
|
55
|
+
};
|
56
|
+
const getTwinMacroMajorVersion = (appDirectory) => {
|
57
|
+
try {
|
58
|
+
const pkgJsonPath = require.resolve(`${TWIN_MACRO_NAME}/package.json`, {
|
59
|
+
paths: [
|
60
|
+
appDirectory
|
61
|
+
]
|
62
|
+
});
|
63
|
+
const { version } = require(pkgJsonPath);
|
64
|
+
return Number(version.split(".")[0]);
|
65
|
+
} catch (err) {
|
66
|
+
return null;
|
67
|
+
}
|
68
|
+
};
|
69
|
+
const getRandomTwConfigFileName = (internalDirectory) => {
|
70
|
+
return (0, _utils.slash)(_path.default.join(internalDirectory, `tailwind.config.${Date.now()}.${(0, _utils.nanoid)()}.js`));
|
71
|
+
};
|
package/dist/cjs/utils.js
CHANGED
@@ -10,15 +10,6 @@ function _export(target, all) {
|
|
10
10
|
});
|
11
11
|
}
|
12
12
|
_export(exports, {
|
13
|
-
template: function() {
|
14
|
-
return template;
|
15
|
-
},
|
16
|
-
checkTwinMacroExist: function() {
|
17
|
-
return checkTwinMacroExist;
|
18
|
-
},
|
19
|
-
getTwinMacroMajorVersion: function() {
|
20
|
-
return getTwinMacroMajorVersion;
|
21
|
-
},
|
22
13
|
getTailwindPath: function() {
|
23
14
|
return getTailwindPath;
|
24
15
|
},
|
@@ -26,49 +17,6 @@ _export(exports, {
|
|
26
17
|
return getTailwindVersion;
|
27
18
|
}
|
28
19
|
});
|
29
|
-
const _interop_require_default = require("@swc/helpers/_/_interop_require_default");
|
30
|
-
const _path = /* @__PURE__ */ _interop_require_default._(require("path"));
|
31
|
-
const _utils = require("@modern-js/utils");
|
32
|
-
const template = (configPath) => `
|
33
|
-
function _interopRequireDefault(obj) {
|
34
|
-
return obj && obj.__esModule ? obj : { default: obj };
|
35
|
-
}
|
36
|
-
const modernConfig = _interopRequireDefault(require('${configPath}')).default;
|
37
|
-
|
38
|
-
const theme =
|
39
|
-
modernConfig && modernConfig.source && modernConfig.source.designSystem
|
40
|
-
? modernConfig.source.designSystem
|
41
|
-
: {};
|
42
|
-
const tailwindcss =
|
43
|
-
modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss
|
44
|
-
? modernConfig.tools.tailwindcss
|
45
|
-
: {};
|
46
|
-
|
47
|
-
module.exports = {
|
48
|
-
theme,
|
49
|
-
...tailwindcss,
|
50
|
-
};
|
51
|
-
`;
|
52
|
-
const TWIN_MACRO_NAME = "twin.macro";
|
53
|
-
const checkTwinMacroExist = async (appDirectory) => {
|
54
|
-
const packageJson = await _utils.fs.readJSON(_path.default.join(appDirectory, "package.json"), {
|
55
|
-
throws: false
|
56
|
-
}) || {};
|
57
|
-
return Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]);
|
58
|
-
};
|
59
|
-
const getTwinMacroMajorVersion = (appDirectory) => {
|
60
|
-
try {
|
61
|
-
const pkgJsonPath = require.resolve(`${TWIN_MACRO_NAME}/package.json`, {
|
62
|
-
paths: [
|
63
|
-
appDirectory
|
64
|
-
]
|
65
|
-
});
|
66
|
-
const { version } = require(pkgJsonPath);
|
67
|
-
return Number(version.split(".")[0]);
|
68
|
-
} catch (err) {
|
69
|
-
return null;
|
70
|
-
}
|
71
|
-
};
|
72
20
|
function getTailwindPath(appDirectory) {
|
73
21
|
try {
|
74
22
|
return require.resolve("tailwindcss", {
|
package/dist/esm/cli.js
CHANGED
@@ -1,26 +1,11 @@
|
|
1
1
|
import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
2
2
|
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
3
3
|
import path from "path";
|
4
|
-
import { fs, CONFIG_CACHE_DIR, globby,
|
5
|
-
import designTokenPlugin from "./design-token/cli";
|
6
|
-
import { getTailwindConfig } from "./
|
7
|
-
import {
|
8
|
-
|
9
|
-
export var getRandomTwConfigFileName = function(internalDirectory) {
|
10
|
-
return slash(path.join(internalDirectory, "tailwind.config.".concat(Date.now(), ".").concat(nanoid(), ".js")));
|
11
|
-
};
|
12
|
-
function getDefaultContent(appDirectory) {
|
13
|
-
var defaultContent = [
|
14
|
-
"./src/**/*.{js,jsx,ts,tsx}"
|
15
|
-
];
|
16
|
-
if (fs.existsSync(path.join(appDirectory, "storybook"))) {
|
17
|
-
defaultContent.push("./storybook/**/*");
|
18
|
-
}
|
19
|
-
if (fs.existsSync(path.join(appDirectory, "config/html"))) {
|
20
|
-
defaultContent.push("./config/html/**/*.{html,ejs,hbs}");
|
21
|
-
}
|
22
|
-
return defaultContent;
|
23
|
-
}
|
4
|
+
import { fs, CONFIG_CACHE_DIR, globby, slash } from "@modern-js/utils";
|
5
|
+
import { designTokenPlugin } from "./design-token/cli";
|
6
|
+
import { getTailwindConfig, loadConfigFile } from "./config";
|
7
|
+
import { getTailwindPath, getTailwindVersion } from "./utils";
|
8
|
+
import { template, checkTwinMacroExist, getTwinMacroMajorVersion, getRandomTwConfigFileName } from "./macro";
|
24
9
|
export var tailwindcssPlugin = function() {
|
25
10
|
var pluginName = (arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {
|
26
11
|
pluginName: "@modern-js/plugin-tailwindcss"
|
@@ -35,7 +20,7 @@ export var tailwindcssPlugin = function() {
|
|
35
20
|
],
|
36
21
|
setup: function() {
|
37
22
|
var _ref = _async_to_generator(function(api) {
|
38
|
-
var _api_useAppContext, appDirectory, internalDirectory, internalTwConfigPath, haveTwinMacro, tailwindPath, tailwindVersion,
|
23
|
+
var _api_useAppContext, appDirectory, internalDirectory, internalTwConfigPath, haveTwinMacro, tailwindPath, tailwindVersion, userTailwindConfig;
|
39
24
|
return _ts_generator(this, function(_state) {
|
40
25
|
switch (_state.label) {
|
41
26
|
case 0:
|
@@ -49,7 +34,12 @@ export var tailwindcssPlugin = function() {
|
|
49
34
|
haveTwinMacro = _state.sent();
|
50
35
|
tailwindPath = getTailwindPath(appDirectory);
|
51
36
|
tailwindVersion = getTailwindVersion(appDirectory);
|
52
|
-
|
37
|
+
return [
|
38
|
+
4,
|
39
|
+
loadConfigFile(appDirectory)
|
40
|
+
];
|
41
|
+
case 2:
|
42
|
+
userTailwindConfig = _state.sent();
|
53
43
|
return [
|
54
44
|
2,
|
55
45
|
{
|
@@ -88,10 +78,12 @@ export var tailwindcssPlugin = function() {
|
|
88
78
|
if (!tailwindConfig) {
|
89
79
|
var _modernConfig_tools, _modernConfig, _modernConfig_source, _modernConfig1;
|
90
80
|
var modernConfig = api.useResolvedConfigContext();
|
91
|
-
tailwindConfig = getTailwindConfig(
|
92
|
-
|
93
|
-
|
94
|
-
|
81
|
+
tailwindConfig = getTailwindConfig({
|
82
|
+
appDirectory: appDirectory,
|
83
|
+
tailwindVersion: tailwindVersion,
|
84
|
+
userConfig: userTailwindConfig,
|
85
|
+
extraConfig: (_modernConfig = modernConfig) === null || _modernConfig === void 0 ? void 0 : (_modernConfig_tools = _modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss,
|
86
|
+
designSystem: (_modernConfig1 = modernConfig) === null || _modernConfig1 === void 0 ? void 0 : (_modernConfig_source = _modernConfig1.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem
|
95
87
|
});
|
96
88
|
}
|
97
89
|
};
|
@@ -112,6 +104,7 @@ export var tailwindcssPlugin = function() {
|
|
112
104
|
},
|
113
105
|
babel: haveTwinMacro ? function(_, param) {
|
114
106
|
var addPlugins = param.addPlugins;
|
107
|
+
var supportCssInJsLibrary = "styled-components";
|
115
108
|
initTailwindConfig();
|
116
109
|
addPlugins([
|
117
110
|
[
|
@@ -130,11 +123,12 @@ export var tailwindcssPlugin = function() {
|
|
130
123
|
},
|
131
124
|
beforeBuildTask: function beforeBuildTask(config) {
|
132
125
|
var modernConfig = api.useResolvedConfigContext();
|
133
|
-
var
|
134
|
-
|
135
|
-
|
136
|
-
|
137
|
-
|
126
|
+
var tailwindConfig = getTailwindConfig({
|
127
|
+
appDirectory: appDirectory,
|
128
|
+
tailwindVersion: tailwindVersion,
|
129
|
+
userConfig: userTailwindConfig,
|
130
|
+
extraConfig: config.style.tailwindcss,
|
131
|
+
designSystem: modernConfig.designSystem
|
138
132
|
});
|
139
133
|
var tailwindPlugin = require(tailwindPath)(tailwindConfig);
|
140
134
|
if (Array.isArray(config.style.postcss.plugins)) {
|
@@ -0,0 +1,93 @@
|
|
1
|
+
import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
2
|
+
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
3
|
+
import path from "path";
|
4
|
+
import { fs, applyOptionsChain, findExists } from "@modern-js/utils";
|
5
|
+
import { cloneDeep } from "@modern-js/utils/lodash";
|
6
|
+
import { bundleRequire } from "@modern-js/node-bundle-require";
|
7
|
+
function getDefaultContent(appDirectory) {
|
8
|
+
var defaultContent = [
|
9
|
+
"./src/**/*.{js,jsx,ts,tsx}"
|
10
|
+
];
|
11
|
+
if (fs.existsSync(path.join(appDirectory, "storybook"))) {
|
12
|
+
defaultContent.push("./storybook/**/*");
|
13
|
+
}
|
14
|
+
if (fs.existsSync(path.join(appDirectory, "config/html"))) {
|
15
|
+
defaultContent.push("./config/html/**/*.{html,ejs,hbs}");
|
16
|
+
}
|
17
|
+
return defaultContent;
|
18
|
+
}
|
19
|
+
var getPureDesignSystemConfig = function(config) {
|
20
|
+
var pureConfig = cloneDeep(config);
|
21
|
+
delete pureConfig.supportStyledComponents;
|
22
|
+
return pureConfig;
|
23
|
+
};
|
24
|
+
var getV2PurgeConfig = function(content) {
|
25
|
+
return {
|
26
|
+
enabled: process.env.NODE_ENV === "production",
|
27
|
+
layers: [
|
28
|
+
"utilities"
|
29
|
+
],
|
30
|
+
content: content
|
31
|
+
};
|
32
|
+
};
|
33
|
+
export function loadConfigFile(appDirectory) {
|
34
|
+
return _loadConfigFile.apply(this, arguments);
|
35
|
+
}
|
36
|
+
function _loadConfigFile() {
|
37
|
+
_loadConfigFile = _async_to_generator(function(appDirectory) {
|
38
|
+
var extensions, configs, configFile, mod;
|
39
|
+
return _ts_generator(this, function(_state) {
|
40
|
+
switch (_state.label) {
|
41
|
+
case 0:
|
42
|
+
extensions = [
|
43
|
+
"ts",
|
44
|
+
"js",
|
45
|
+
"cjs",
|
46
|
+
"mjs"
|
47
|
+
];
|
48
|
+
configs = extensions.map(function(ext) {
|
49
|
+
return path.resolve(appDirectory, "tailwind.config.".concat(ext));
|
50
|
+
});
|
51
|
+
configFile = findExists(configs);
|
52
|
+
if (!configFile)
|
53
|
+
return [
|
54
|
+
3,
|
55
|
+
2
|
56
|
+
];
|
57
|
+
return [
|
58
|
+
4,
|
59
|
+
bundleRequire(configFile)
|
60
|
+
];
|
61
|
+
case 1:
|
62
|
+
mod = _state.sent();
|
63
|
+
return [
|
64
|
+
2,
|
65
|
+
mod.default || mod
|
66
|
+
];
|
67
|
+
case 2:
|
68
|
+
return [
|
69
|
+
2,
|
70
|
+
{}
|
71
|
+
];
|
72
|
+
}
|
73
|
+
});
|
74
|
+
});
|
75
|
+
return _loadConfigFile.apply(this, arguments);
|
76
|
+
}
|
77
|
+
var getTailwindConfig = function(param) {
|
78
|
+
var tailwindVersion = param.tailwindVersion, appDirectory = param.appDirectory, userConfig = param.userConfig, extraConfig = param.extraConfig, designSystem = param.designSystem;
|
79
|
+
var content = getDefaultContent(appDirectory);
|
80
|
+
var tailwindConfig = tailwindVersion === "3" ? {
|
81
|
+
content: content
|
82
|
+
} : {
|
83
|
+
purge: getV2PurgeConfig(content)
|
84
|
+
};
|
85
|
+
Object.assign(tailwindConfig, userConfig);
|
86
|
+
tailwindConfig = extraConfig ? applyOptionsChain(tailwindConfig, extraConfig) : tailwindConfig;
|
87
|
+
var designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
|
88
|
+
if (designSystemConfig && Object.keys(designSystemConfig).length > 0) {
|
89
|
+
tailwindConfig.theme = designSystemConfig;
|
90
|
+
}
|
91
|
+
return tailwindConfig;
|
92
|
+
};
|
93
|
+
export { getTailwindConfig };
|
@@ -1,6 +1,6 @@
|
|
1
1
|
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
2
2
|
import { lazyImport, createRuntimeExportsUtils } from "@modern-js/utils";
|
3
|
-
export
|
3
|
+
export var designTokenPlugin = function() {
|
4
4
|
var pluginName = (arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {
|
5
5
|
pluginName: "@modern-js/plugin-tailwindcss"
|
6
6
|
}).pluginName;
|
@@ -113,5 +113,4 @@ export default function() {
|
|
113
113
|
};
|
114
114
|
}
|
115
115
|
};
|
116
|
-
}
|
117
|
-
;
|
116
|
+
};
|
@@ -0,0 +1,49 @@
|
|
1
|
+
import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
2
|
+
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
3
|
+
import path from "path";
|
4
|
+
import { fs, nanoid, slash } from "@modern-js/utils";
|
5
|
+
export var template = function(configPath) {
|
6
|
+
return "\nfunction _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : { default: obj };\n}\nconst modernConfig = _interopRequireDefault(require('".concat(configPath, "')).default;\n\nconst theme =\n modernConfig && modernConfig.source && modernConfig.source.designSystem\n ? modernConfig.source.designSystem\n : {};\nconst tailwindcss =\n modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss\n ? modernConfig.tools.tailwindcss\n : {};\n\nmodule.exports = {\n theme,\n ...tailwindcss,\n};\n");
|
7
|
+
};
|
8
|
+
var TWIN_MACRO_NAME = "twin.macro";
|
9
|
+
export var checkTwinMacroExist = function() {
|
10
|
+
var _ref = _async_to_generator(function(appDirectory) {
|
11
|
+
var packageJson;
|
12
|
+
return _ts_generator(this, function(_state) {
|
13
|
+
switch (_state.label) {
|
14
|
+
case 0:
|
15
|
+
return [
|
16
|
+
4,
|
17
|
+
fs.readJSON(path.join(appDirectory, "package.json"), {
|
18
|
+
throws: false
|
19
|
+
})
|
20
|
+
];
|
21
|
+
case 1:
|
22
|
+
packageJson = _state.sent() || {};
|
23
|
+
return [
|
24
|
+
2,
|
25
|
+
Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME])
|
26
|
+
];
|
27
|
+
}
|
28
|
+
});
|
29
|
+
});
|
30
|
+
return function checkTwinMacroExist2(appDirectory) {
|
31
|
+
return _ref.apply(this, arguments);
|
32
|
+
};
|
33
|
+
}();
|
34
|
+
export var getTwinMacroMajorVersion = function(appDirectory) {
|
35
|
+
try {
|
36
|
+
var pkgJsonPath = require.resolve("".concat(TWIN_MACRO_NAME, "/package.json"), {
|
37
|
+
paths: [
|
38
|
+
appDirectory
|
39
|
+
]
|
40
|
+
});
|
41
|
+
var version = require(pkgJsonPath).version;
|
42
|
+
return Number(version.split(".")[0]);
|
43
|
+
} catch (err) {
|
44
|
+
return null;
|
45
|
+
}
|
46
|
+
};
|
47
|
+
export var getRandomTwConfigFileName = function(internalDirectory) {
|
48
|
+
return slash(path.join(internalDirectory, "tailwind.config.".concat(Date.now(), ".").concat(nanoid(), ".js")));
|
49
|
+
};
|
package/dist/esm/utils.js
CHANGED
@@ -1,49 +1,3 @@
|
|
1
|
-
import { _ as _async_to_generator } from "@swc/helpers/_/_async_to_generator";
|
2
|
-
import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
|
3
|
-
import path from "path";
|
4
|
-
import { fs } from "@modern-js/utils";
|
5
|
-
export var template = function(configPath) {
|
6
|
-
return "\nfunction _interopRequireDefault(obj) {\n return obj && obj.__esModule ? obj : { default: obj };\n}\nconst modernConfig = _interopRequireDefault(require('".concat(configPath, "')).default;\n\nconst theme =\n modernConfig && modernConfig.source && modernConfig.source.designSystem\n ? modernConfig.source.designSystem\n : {};\nconst tailwindcss =\n modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss\n ? modernConfig.tools.tailwindcss\n : {};\n\nmodule.exports = {\n theme,\n ...tailwindcss,\n};\n");
|
7
|
-
};
|
8
|
-
var TWIN_MACRO_NAME = "twin.macro";
|
9
|
-
export var checkTwinMacroExist = function() {
|
10
|
-
var _ref = _async_to_generator(function(appDirectory) {
|
11
|
-
var packageJson;
|
12
|
-
return _ts_generator(this, function(_state) {
|
13
|
-
switch (_state.label) {
|
14
|
-
case 0:
|
15
|
-
return [
|
16
|
-
4,
|
17
|
-
fs.readJSON(path.join(appDirectory, "package.json"), {
|
18
|
-
throws: false
|
19
|
-
})
|
20
|
-
];
|
21
|
-
case 1:
|
22
|
-
packageJson = _state.sent() || {};
|
23
|
-
return [
|
24
|
-
2,
|
25
|
-
Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME])
|
26
|
-
];
|
27
|
-
}
|
28
|
-
});
|
29
|
-
});
|
30
|
-
return function checkTwinMacroExist2(appDirectory) {
|
31
|
-
return _ref.apply(this, arguments);
|
32
|
-
};
|
33
|
-
}();
|
34
|
-
export var getTwinMacroMajorVersion = function(appDirectory) {
|
35
|
-
try {
|
36
|
-
var pkgJsonPath = require.resolve("".concat(TWIN_MACRO_NAME, "/package.json"), {
|
37
|
-
paths: [
|
38
|
-
appDirectory
|
39
|
-
]
|
40
|
-
});
|
41
|
-
var version = require(pkgJsonPath).version;
|
42
|
-
return Number(version.split(".")[0]);
|
43
|
-
} catch (err) {
|
44
|
-
return null;
|
45
|
-
}
|
46
|
-
};
|
47
1
|
export function getTailwindPath(appDirectory) {
|
48
2
|
try {
|
49
3
|
return require.resolve("tailwindcss", {
|
package/dist/esm-node/cli.js
CHANGED
@@ -1,24 +1,9 @@
|
|
1
1
|
import path from "path";
|
2
|
-
import { fs, CONFIG_CACHE_DIR, globby,
|
3
|
-
import designTokenPlugin from "./design-token/cli";
|
4
|
-
import { getTailwindConfig } from "./
|
5
|
-
import {
|
6
|
-
|
7
|
-
export const getRandomTwConfigFileName = (internalDirectory) => {
|
8
|
-
return slash(path.join(internalDirectory, `tailwind.config.${Date.now()}.${nanoid()}.js`));
|
9
|
-
};
|
10
|
-
function getDefaultContent(appDirectory) {
|
11
|
-
const defaultContent = [
|
12
|
-
"./src/**/*.{js,jsx,ts,tsx}"
|
13
|
-
];
|
14
|
-
if (fs.existsSync(path.join(appDirectory, "storybook"))) {
|
15
|
-
defaultContent.push("./storybook/**/*");
|
16
|
-
}
|
17
|
-
if (fs.existsSync(path.join(appDirectory, "config/html"))) {
|
18
|
-
defaultContent.push("./config/html/**/*.{html,ejs,hbs}");
|
19
|
-
}
|
20
|
-
return defaultContent;
|
21
|
-
}
|
2
|
+
import { fs, CONFIG_CACHE_DIR, globby, slash } from "@modern-js/utils";
|
3
|
+
import { designTokenPlugin } from "./design-token/cli";
|
4
|
+
import { getTailwindConfig, loadConfigFile } from "./config";
|
5
|
+
import { getTailwindPath, getTailwindVersion } from "./utils";
|
6
|
+
import { template, checkTwinMacroExist, getTwinMacroMajorVersion, getRandomTwConfigFileName } from "./macro";
|
22
7
|
export const tailwindcssPlugin = ({ pluginName } = {
|
23
8
|
pluginName: "@modern-js/plugin-tailwindcss"
|
24
9
|
}) => ({
|
@@ -35,7 +20,7 @@ export const tailwindcssPlugin = ({ pluginName } = {
|
|
35
20
|
const haveTwinMacro = await checkTwinMacroExist(appDirectory);
|
36
21
|
const tailwindPath = getTailwindPath(appDirectory);
|
37
22
|
const tailwindVersion = getTailwindVersion(appDirectory);
|
38
|
-
const
|
23
|
+
const userTailwindConfig = await loadConfigFile(appDirectory);
|
39
24
|
return {
|
40
25
|
prepare() {
|
41
26
|
if (haveTwinMacro) {
|
@@ -72,10 +57,12 @@ export const tailwindcssPlugin = ({ pluginName } = {
|
|
72
57
|
if (!tailwindConfig) {
|
73
58
|
var _modernConfig_tools, _modernConfig, _modernConfig_source, _modernConfig1;
|
74
59
|
const modernConfig = api.useResolvedConfigContext();
|
75
|
-
tailwindConfig = getTailwindConfig(
|
76
|
-
|
77
|
-
|
78
|
-
|
60
|
+
tailwindConfig = getTailwindConfig({
|
61
|
+
appDirectory,
|
62
|
+
tailwindVersion,
|
63
|
+
userConfig: userTailwindConfig,
|
64
|
+
extraConfig: (_modernConfig = modernConfig) === null || _modernConfig === void 0 ? void 0 : (_modernConfig_tools = _modernConfig.tools) === null || _modernConfig_tools === void 0 ? void 0 : _modernConfig_tools.tailwindcss,
|
65
|
+
designSystem: (_modernConfig1 = modernConfig) === null || _modernConfig1 === void 0 ? void 0 : (_modernConfig_source = _modernConfig1.source) === null || _modernConfig_source === void 0 ? void 0 : _modernConfig_source.designSystem
|
79
66
|
});
|
80
67
|
}
|
81
68
|
};
|
@@ -95,6 +82,7 @@ export const tailwindcssPlugin = ({ pluginName } = {
|
|
95
82
|
}
|
96
83
|
},
|
97
84
|
babel: haveTwinMacro ? (_, { addPlugins }) => {
|
85
|
+
const supportCssInJsLibrary = "styled-components";
|
98
86
|
initTailwindConfig();
|
99
87
|
addPlugins([
|
100
88
|
[
|
@@ -113,11 +101,12 @@ export const tailwindcssPlugin = ({ pluginName } = {
|
|
113
101
|
},
|
114
102
|
beforeBuildTask(config) {
|
115
103
|
const modernConfig = api.useResolvedConfigContext();
|
116
|
-
const
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
|
104
|
+
const tailwindConfig = getTailwindConfig({
|
105
|
+
appDirectory,
|
106
|
+
tailwindVersion,
|
107
|
+
userConfig: userTailwindConfig,
|
108
|
+
extraConfig: config.style.tailwindcss,
|
109
|
+
designSystem: modernConfig.designSystem
|
121
110
|
});
|
122
111
|
const tailwindPlugin = require(tailwindPath)(tailwindConfig);
|
123
112
|
if (Array.isArray(config.style.postcss.plugins)) {
|
@@ -0,0 +1,59 @@
|
|
1
|
+
import path from "path";
|
2
|
+
import { fs, applyOptionsChain, findExists } from "@modern-js/utils";
|
3
|
+
import { cloneDeep } from "@modern-js/utils/lodash";
|
4
|
+
import { bundleRequire } from "@modern-js/node-bundle-require";
|
5
|
+
function getDefaultContent(appDirectory) {
|
6
|
+
const defaultContent = [
|
7
|
+
"./src/**/*.{js,jsx,ts,tsx}"
|
8
|
+
];
|
9
|
+
if (fs.existsSync(path.join(appDirectory, "storybook"))) {
|
10
|
+
defaultContent.push("./storybook/**/*");
|
11
|
+
}
|
12
|
+
if (fs.existsSync(path.join(appDirectory, "config/html"))) {
|
13
|
+
defaultContent.push("./config/html/**/*.{html,ejs,hbs}");
|
14
|
+
}
|
15
|
+
return defaultContent;
|
16
|
+
}
|
17
|
+
const getPureDesignSystemConfig = (config) => {
|
18
|
+
const pureConfig = cloneDeep(config);
|
19
|
+
delete pureConfig.supportStyledComponents;
|
20
|
+
return pureConfig;
|
21
|
+
};
|
22
|
+
const getV2PurgeConfig = (content) => ({
|
23
|
+
enabled: process.env.NODE_ENV === "production",
|
24
|
+
layers: [
|
25
|
+
"utilities"
|
26
|
+
],
|
27
|
+
content
|
28
|
+
});
|
29
|
+
export async function loadConfigFile(appDirectory) {
|
30
|
+
const extensions = [
|
31
|
+
"ts",
|
32
|
+
"js",
|
33
|
+
"cjs",
|
34
|
+
"mjs"
|
35
|
+
];
|
36
|
+
const configs = extensions.map((ext) => path.resolve(appDirectory, `tailwind.config.${ext}`));
|
37
|
+
const configFile = findExists(configs);
|
38
|
+
if (configFile) {
|
39
|
+
const mod = await bundleRequire(configFile);
|
40
|
+
return mod.default || mod;
|
41
|
+
}
|
42
|
+
return {};
|
43
|
+
}
|
44
|
+
const getTailwindConfig = ({ tailwindVersion, appDirectory, userConfig, extraConfig, designSystem }) => {
|
45
|
+
const content = getDefaultContent(appDirectory);
|
46
|
+
let tailwindConfig = tailwindVersion === "3" ? {
|
47
|
+
content
|
48
|
+
} : {
|
49
|
+
purge: getV2PurgeConfig(content)
|
50
|
+
};
|
51
|
+
Object.assign(tailwindConfig, userConfig);
|
52
|
+
tailwindConfig = extraConfig ? applyOptionsChain(tailwindConfig, extraConfig) : tailwindConfig;
|
53
|
+
const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
|
54
|
+
if (designSystemConfig && Object.keys(designSystemConfig).length > 0) {
|
55
|
+
tailwindConfig.theme = designSystemConfig;
|
56
|
+
}
|
57
|
+
return tailwindConfig;
|
58
|
+
};
|
59
|
+
export { getTailwindConfig };
|
@@ -0,0 +1,45 @@
|
|
1
|
+
import path from "path";
|
2
|
+
import { fs, nanoid, slash } from "@modern-js/utils";
|
3
|
+
export const template = (configPath) => `
|
4
|
+
function _interopRequireDefault(obj) {
|
5
|
+
return obj && obj.__esModule ? obj : { default: obj };
|
6
|
+
}
|
7
|
+
const modernConfig = _interopRequireDefault(require('${configPath}')).default;
|
8
|
+
|
9
|
+
const theme =
|
10
|
+
modernConfig && modernConfig.source && modernConfig.source.designSystem
|
11
|
+
? modernConfig.source.designSystem
|
12
|
+
: {};
|
13
|
+
const tailwindcss =
|
14
|
+
modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss
|
15
|
+
? modernConfig.tools.tailwindcss
|
16
|
+
: {};
|
17
|
+
|
18
|
+
module.exports = {
|
19
|
+
theme,
|
20
|
+
...tailwindcss,
|
21
|
+
};
|
22
|
+
`;
|
23
|
+
const TWIN_MACRO_NAME = "twin.macro";
|
24
|
+
export const checkTwinMacroExist = async (appDirectory) => {
|
25
|
+
const packageJson = await fs.readJSON(path.join(appDirectory, "package.json"), {
|
26
|
+
throws: false
|
27
|
+
}) || {};
|
28
|
+
return Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]);
|
29
|
+
};
|
30
|
+
export const getTwinMacroMajorVersion = (appDirectory) => {
|
31
|
+
try {
|
32
|
+
const pkgJsonPath = require.resolve(`${TWIN_MACRO_NAME}/package.json`, {
|
33
|
+
paths: [
|
34
|
+
appDirectory
|
35
|
+
]
|
36
|
+
});
|
37
|
+
const { version } = require(pkgJsonPath);
|
38
|
+
return Number(version.split(".")[0]);
|
39
|
+
} catch (err) {
|
40
|
+
return null;
|
41
|
+
}
|
42
|
+
};
|
43
|
+
export const getRandomTwConfigFileName = (internalDirectory) => {
|
44
|
+
return slash(path.join(internalDirectory, `tailwind.config.${Date.now()}.${nanoid()}.js`));
|
45
|
+
};
|
package/dist/esm-node/utils.js
CHANGED
@@ -1,45 +1,3 @@
|
|
1
|
-
import path from "path";
|
2
|
-
import { fs } from "@modern-js/utils";
|
3
|
-
export const template = (configPath) => `
|
4
|
-
function _interopRequireDefault(obj) {
|
5
|
-
return obj && obj.__esModule ? obj : { default: obj };
|
6
|
-
}
|
7
|
-
const modernConfig = _interopRequireDefault(require('${configPath}')).default;
|
8
|
-
|
9
|
-
const theme =
|
10
|
-
modernConfig && modernConfig.source && modernConfig.source.designSystem
|
11
|
-
? modernConfig.source.designSystem
|
12
|
-
: {};
|
13
|
-
const tailwindcss =
|
14
|
-
modernConfig && modernConfig.tools && modernConfig.tools.tailwindcss
|
15
|
-
? modernConfig.tools.tailwindcss
|
16
|
-
: {};
|
17
|
-
|
18
|
-
module.exports = {
|
19
|
-
theme,
|
20
|
-
...tailwindcss,
|
21
|
-
};
|
22
|
-
`;
|
23
|
-
const TWIN_MACRO_NAME = "twin.macro";
|
24
|
-
export const checkTwinMacroExist = async (appDirectory) => {
|
25
|
-
const packageJson = await fs.readJSON(path.join(appDirectory, "package.json"), {
|
26
|
-
throws: false
|
27
|
-
}) || {};
|
28
|
-
return Boolean(typeof packageJson.dependencies === "object" && packageJson.dependencies[TWIN_MACRO_NAME] || typeof packageJson.devDependencies === "object" && packageJson.devDependencies[TWIN_MACRO_NAME]);
|
29
|
-
};
|
30
|
-
export const getTwinMacroMajorVersion = (appDirectory) => {
|
31
|
-
try {
|
32
|
-
const pkgJsonPath = require.resolve(`${TWIN_MACRO_NAME}/package.json`, {
|
33
|
-
paths: [
|
34
|
-
appDirectory
|
35
|
-
]
|
36
|
-
});
|
37
|
-
const { version } = require(pkgJsonPath);
|
38
|
-
return Number(version.split(".")[0]);
|
39
|
-
} catch (err) {
|
40
|
-
return null;
|
41
|
-
}
|
42
|
-
};
|
43
1
|
export function getTailwindPath(appDirectory) {
|
44
2
|
try {
|
45
3
|
return require.resolve("tailwindcss", {
|
package/dist/types/cli.d.ts
CHANGED
@@ -1,6 +1,5 @@
|
|
1
1
|
import type { LegacyAppTools } from '@modern-js/app-tools';
|
2
2
|
import type { CliPlugin, ModuleTools } from '@modern-js/module-tools';
|
3
|
-
export declare const getRandomTwConfigFileName: (internalDirectory: string) => string;
|
4
3
|
export declare const tailwindcssPlugin: ({
|
5
4
|
pluginName
|
6
5
|
}?: {
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import type { DesignSystem, TailwindConfig, ExtraTailwindConfig } from './types';
|
2
|
+
export declare function loadConfigFile(appDirectory: string): Promise<any>;
|
3
|
+
/**
|
4
|
+
* Config priority:
|
5
|
+
* `source.designSystem` > `tools.tailwindcss` (extraConfig) > `tailwind.config.*` (userConfig) > `defaultConfig`
|
6
|
+
*/
|
7
|
+
declare const getTailwindConfig: ({
|
8
|
+
tailwindVersion,
|
9
|
+
appDirectory,
|
10
|
+
userConfig,
|
11
|
+
extraConfig,
|
12
|
+
designSystem
|
13
|
+
}: {
|
14
|
+
tailwindVersion: '2' | '3';
|
15
|
+
appDirectory: string;
|
16
|
+
userConfig: TailwindConfig;
|
17
|
+
extraConfig?: ExtraTailwindConfig | undefined;
|
18
|
+
designSystem?: DesignSystem | undefined;
|
19
|
+
}) => TailwindConfig;
|
20
|
+
export { getTailwindConfig };
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import type { CliPlugin, LegacyAppTools } from '@modern-js/app-tools';
|
2
|
-
declare const
|
2
|
+
export declare const designTokenPlugin: ({
|
3
3
|
pluginName
|
4
4
|
}?: {
|
5
5
|
pluginName: string;
|
6
|
-
}) => CliPlugin<LegacyAppTools>;
|
7
|
-
export default _default;
|
6
|
+
}) => CliPlugin<LegacyAppTools>;
|
@@ -0,0 +1,4 @@
|
|
1
|
+
export declare const template: (configPath: string) => string;
|
2
|
+
export declare const checkTwinMacroExist: (appDirectory: string) => Promise<boolean>;
|
3
|
+
export declare const getTwinMacroMajorVersion: (appDirectory: string) => number | null;
|
4
|
+
export declare const getRandomTwConfigFileName: (internalDirectory: string) => string;
|
package/dist/types/types.d.ts
CHANGED
@@ -1,4 +1,5 @@
|
|
1
|
-
export type DesignSystem =
|
1
|
+
export type DesignSystem = TailwindConfig & {
|
2
2
|
supportStyledComponents?: boolean;
|
3
3
|
};
|
4
|
-
export type
|
4
|
+
export type TailwindConfig = Record<string, any>;
|
5
|
+
export type ExtraTailwindConfig = TailwindConfig | ((options: TailwindConfig) => TailwindConfig | void);
|
package/dist/types/utils.d.ts
CHANGED
@@ -1,5 +1,2 @@
|
|
1
|
-
export declare const template: (configPath: string) => string;
|
2
|
-
export declare const checkTwinMacroExist: (appDirectory: string) => Promise<boolean>;
|
3
|
-
export declare const getTwinMacroMajorVersion: (appDirectory: string) => number | null;
|
4
1
|
export declare function getTailwindPath(appDirectory: string): string;
|
5
2
|
export declare function getTailwindVersion(appDirectory: string): '2' | '3';
|
package/package.json
CHANGED
@@ -15,7 +15,7 @@
|
|
15
15
|
"modern",
|
16
16
|
"modern.js"
|
17
17
|
],
|
18
|
-
"version": "2.
|
18
|
+
"version": "2.33.0",
|
19
19
|
"jsnext:source": "./src/index.ts",
|
20
20
|
"types": "./dist/types/index.d.ts",
|
21
21
|
"main": "./dist/cjs/index.js",
|
@@ -49,7 +49,8 @@
|
|
49
49
|
"babel-plugin-macros": "3.1.0",
|
50
50
|
"hoist-non-react-statics": "^3.3.2",
|
51
51
|
"@swc/helpers": "0.5.1",
|
52
|
-
"@modern-js/
|
52
|
+
"@modern-js/node-bundle-require": "2.33.0",
|
53
|
+
"@modern-js/utils": "2.33.0"
|
53
54
|
},
|
54
55
|
"devDependencies": {
|
55
56
|
"@types/jest": "^29",
|
@@ -59,17 +60,17 @@
|
|
59
60
|
"jest": "^29",
|
60
61
|
"react": "^18",
|
61
62
|
"postcss": "8.4.27",
|
62
|
-
"@modern-js/
|
63
|
-
"@modern-js/
|
64
|
-
"@modern-js/
|
65
|
-
"@
|
66
|
-
"@modern-js/
|
67
|
-
"@
|
68
|
-
"@scripts/
|
63
|
+
"@modern-js/runtime": "2.33.0",
|
64
|
+
"@modern-js/types": "2.33.0",
|
65
|
+
"@modern-js/app-tools": "2.33.0",
|
66
|
+
"@scripts/jest-config": "2.33.0",
|
67
|
+
"@modern-js/core": "2.33.0",
|
68
|
+
"@modern-js/module-tools": "2.33.0",
|
69
|
+
"@scripts/build": "2.33.0"
|
69
70
|
},
|
70
71
|
"peerDependencies": {
|
71
72
|
"tailwindcss": ">= 2.0.0 || >= 3.0.0",
|
72
|
-
"@modern-js/runtime": "^2.
|
73
|
+
"@modern-js/runtime": "^2.33.0"
|
73
74
|
},
|
74
75
|
"peerDependenciesMeta": {
|
75
76
|
"@modern-js/runtime": {
|
package/dist/cjs/tailwind.js
DELETED
@@ -1,39 +0,0 @@
|
|
1
|
-
"use strict";
|
2
|
-
Object.defineProperty(exports, "__esModule", {
|
3
|
-
value: true
|
4
|
-
});
|
5
|
-
Object.defineProperty(exports, "getTailwindConfig", {
|
6
|
-
enumerable: true,
|
7
|
-
get: function() {
|
8
|
-
return getTailwindConfig;
|
9
|
-
}
|
10
|
-
});
|
11
|
-
const _utils = require("@modern-js/utils");
|
12
|
-
const _lodash = require("@modern-js/utils/lodash");
|
13
|
-
const getPureDesignSystemConfig = (config) => {
|
14
|
-
const pureConfig = (0, _lodash.cloneDeep)(config);
|
15
|
-
delete pureConfig.supportStyledComponents;
|
16
|
-
return pureConfig;
|
17
|
-
};
|
18
|
-
const getTailwindConfig = (tailwindVersion, tailwindcss, designSystem, option = {}) => {
|
19
|
-
const purgeConfig = (0, _lodash.merge)({
|
20
|
-
// TODO: how the operating environment is determined
|
21
|
-
enabled: process.env.NODE_ENV === "production",
|
22
|
-
// TODO: Remove or not
|
23
|
-
layers: [
|
24
|
-
"utilities"
|
25
|
-
],
|
26
|
-
content: []
|
27
|
-
}, option.pureConfig || {});
|
28
|
-
const defaultTailwindConfig = tailwindVersion === "3" ? {
|
29
|
-
content: purgeConfig.content
|
30
|
-
} : {
|
31
|
-
purge: purgeConfig
|
32
|
-
};
|
33
|
-
const tailwindConfig = (0, _utils.applyOptionsChain)(defaultTailwindConfig, tailwindcss || {});
|
34
|
-
const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
|
35
|
-
if (designSystemConfig && Object.keys(designSystemConfig).length > 0) {
|
36
|
-
tailwindConfig.theme = designSystemConfig;
|
37
|
-
}
|
38
|
-
return tailwindConfig;
|
39
|
-
};
|
package/dist/esm/tailwind.js
DELETED
@@ -1,31 +0,0 @@
|
|
1
|
-
import { applyOptionsChain } from "@modern-js/utils";
|
2
|
-
import { merge, cloneDeep } from "@modern-js/utils/lodash";
|
3
|
-
var getPureDesignSystemConfig = function(config) {
|
4
|
-
var pureConfig = cloneDeep(config);
|
5
|
-
delete pureConfig.supportStyledComponents;
|
6
|
-
return pureConfig;
|
7
|
-
};
|
8
|
-
var getTailwindConfig = function(tailwindVersion, tailwindcss, designSystem) {
|
9
|
-
var option = arguments.length > 3 && arguments[3] !== void 0 ? arguments[3] : {};
|
10
|
-
var purgeConfig = merge({
|
11
|
-
// TODO: how the operating environment is determined
|
12
|
-
enabled: process.env.NODE_ENV === "production",
|
13
|
-
// TODO: Remove or not
|
14
|
-
layers: [
|
15
|
-
"utilities"
|
16
|
-
],
|
17
|
-
content: []
|
18
|
-
}, option.pureConfig || {});
|
19
|
-
var defaultTailwindConfig = tailwindVersion === "3" ? {
|
20
|
-
content: purgeConfig.content
|
21
|
-
} : {
|
22
|
-
purge: purgeConfig
|
23
|
-
};
|
24
|
-
var tailwindConfig = applyOptionsChain(defaultTailwindConfig, tailwindcss || {});
|
25
|
-
var designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
|
26
|
-
if (designSystemConfig && Object.keys(designSystemConfig).length > 0) {
|
27
|
-
tailwindConfig.theme = designSystemConfig;
|
28
|
-
}
|
29
|
-
return tailwindConfig;
|
30
|
-
};
|
31
|
-
export { getTailwindConfig };
|
@@ -1,30 +0,0 @@
|
|
1
|
-
import { applyOptionsChain } from "@modern-js/utils";
|
2
|
-
import { merge, cloneDeep } from "@modern-js/utils/lodash";
|
3
|
-
const getPureDesignSystemConfig = (config) => {
|
4
|
-
const pureConfig = cloneDeep(config);
|
5
|
-
delete pureConfig.supportStyledComponents;
|
6
|
-
return pureConfig;
|
7
|
-
};
|
8
|
-
const getTailwindConfig = (tailwindVersion, tailwindcss, designSystem, option = {}) => {
|
9
|
-
const purgeConfig = merge({
|
10
|
-
// TODO: how the operating environment is determined
|
11
|
-
enabled: process.env.NODE_ENV === "production",
|
12
|
-
// TODO: Remove or not
|
13
|
-
layers: [
|
14
|
-
"utilities"
|
15
|
-
],
|
16
|
-
content: []
|
17
|
-
}, option.pureConfig || {});
|
18
|
-
const defaultTailwindConfig = tailwindVersion === "3" ? {
|
19
|
-
content: purgeConfig.content
|
20
|
-
} : {
|
21
|
-
purge: purgeConfig
|
22
|
-
};
|
23
|
-
const tailwindConfig = applyOptionsChain(defaultTailwindConfig, tailwindcss || {});
|
24
|
-
const designSystemConfig = getPureDesignSystemConfig(designSystem !== null && designSystem !== void 0 ? designSystem : {});
|
25
|
-
if (designSystemConfig && Object.keys(designSystemConfig).length > 0) {
|
26
|
-
tailwindConfig.theme = designSystemConfig;
|
27
|
-
}
|
28
|
-
return tailwindConfig;
|
29
|
-
};
|
30
|
-
export { getTailwindConfig };
|
package/dist/types/tailwind.d.ts
DELETED
@@ -1,5 +0,0 @@
|
|
1
|
-
import { DesignSystem, Tailwind } from './types';
|
2
|
-
declare const getTailwindConfig: (tailwindVersion: '2' | '3', tailwindcss?: Tailwind, designSystem?: DesignSystem, option?: {
|
3
|
-
pureConfig?: Record<string, any>;
|
4
|
-
}) => Record<string, any>;
|
5
|
-
export { getTailwindConfig };
|