1 | "use strict";
|
2 | Object.defineProperty(exports, "__esModule", { value: true });
|
3 | const tslib_1 = require("tslib");
|
4 | const cli_utils_1 = require("@design-systems/cli-utils");
|
5 | const cli_utils_2 = require("@design-systems/cli-utils");
|
6 | const fs_extra_1 = tslib_1.__importDefault(require("fs-extra"));
|
7 | const path_1 = tslib_1.__importDefault(require("path"));
|
8 | const postcss_1 = tslib_1.__importDefault(require("postcss"));
|
9 | const postcss_load_config_1 = tslib_1.__importDefault(require("postcss-load-config"));
|
10 | const code_frame_1 = require("@babel/code-frame");
|
11 | const utils_1 = require("./utils");
|
12 | const logger = cli_utils_1.createLogger({ scope: 'build' });
|
13 |
|
14 | function getCSSPath(inFile, inDir, outDir) {
|
15 | const name = path_1.default.basename(inFile);
|
16 | const outPath = utils_1.getOutPath(inDir, inFile, outDir);
|
17 | const cssFile = path_1.default.join(outPath, name);
|
18 | return cssFile;
|
19 | }
|
20 | exports.getCSSPath = getCSSPath;
|
21 |
|
22 |
|
23 |
|
24 |
|
25 | function getUserPostcssConfig(cwd = process.cwd()) {
|
26 | const CONFIG_FILENAME = 'postcss.config.js';
|
27 |
|
28 | const pkgConfigPath = path_1.default.join(cwd, CONFIG_FILENAME);
|
29 | if (fs_extra_1.default.existsSync(pkgConfigPath)) {
|
30 | return pkgConfigPath;
|
31 | }
|
32 |
|
33 | const monoRepoConfigPath = path_1.default.join(cli_utils_2.getMonorepoRoot(cwd), CONFIG_FILENAME);
|
34 | if (fs_extra_1.default.existsSync(monoRepoConfigPath)) {
|
35 | return monoRepoConfigPath;
|
36 | }
|
37 |
|
38 | return '';
|
39 | }
|
40 |
|
41 | const reportConfigError = (error) => {
|
42 |
|
43 |
|
44 | if (!error.message.includes('No PostCSS Config found')) {
|
45 | logger.error('Something is wrong in your postcss.config!');
|
46 |
|
47 | console.log(error);
|
48 | process.exit(1);
|
49 | }
|
50 | };
|
51 |
|
52 | async function getPostCssConfig({ useModules, configFile = require.resolve('./configs/postcss.config'), outDir = 'dist', cwd = process.cwd(), reportError = true }) {
|
53 | const context = useModules
|
54 | ? {
|
55 | env: 'module',
|
56 | outDir
|
57 | }
|
58 | : {};
|
59 | try {
|
60 | return await postcss_load_config_1.default(context, getUserPostcssConfig(cwd));
|
61 | }
|
62 | catch (error) {
|
63 | if (reportError) {
|
64 | reportConfigError(error);
|
65 | logger.trace(error);
|
66 | }
|
67 | return postcss_load_config_1.default(context, configFile);
|
68 | }
|
69 | }
|
70 | exports.getPostCssConfig = getPostCssConfig;
|
71 |
|
72 | function getPostCssConfigSync({ useModules, configFile = require.resolve('./configs/postcss.config'), outDir = 'dist', cwd = process.cwd(), reportError = true }) {
|
73 | const context = useModules
|
74 | ? {
|
75 | env: 'module',
|
76 | outDir
|
77 | }
|
78 | : {};
|
79 | try {
|
80 | return postcss_load_config_1.default.sync(context, getUserPostcssConfig(cwd));
|
81 | }
|
82 | catch (error) {
|
83 | if (reportError) {
|
84 | reportConfigError(error);
|
85 | logger.trace(error);
|
86 | }
|
87 | return postcss_load_config_1.default.sync(context, configFile);
|
88 | }
|
89 | }
|
90 | exports.getPostCssConfigSync = getPostCssConfigSync;
|
91 |
|
92 |
|
93 |
|
94 |
|
95 |
|
96 |
|
97 |
|
98 | async function transpile({ inFile, inDir, outDir, configFile, watch }) {
|
99 |
|
100 | const cssFile = getCSSPath(inFile, inDir, outDir);
|
101 | const { plugins, options } = await getPostCssConfig({
|
102 | useModules: true,
|
103 | configFile,
|
104 | outDir
|
105 | });
|
106 | const processor = postcss_1.default(plugins);
|
107 | const fileContents = await fs_extra_1.default.readFile(inFile);
|
108 | try {
|
109 | const result = await processor.process(fileContents, Object.assign(Object.assign({}, options), { plugins, to: cssFile, from: inFile, map: { inline: false } }));
|
110 | await fs_extra_1.default.outputFile(`${cssFile}.map`, result.map
|
111 | .toString()
|
112 | .replace(/<input css (\d+)>/g, '../src/<input css $1>'));
|
113 | return result;
|
114 | }
|
115 | catch (error) {
|
116 | logger.error('Something went wrong building your css!');
|
117 | let message = error;
|
118 | if (error.name === 'CssSyntaxError') {
|
119 | const { line, column, file, reason } = error;
|
120 | message = utils_1.formatError({
|
121 | file,
|
122 | line,
|
123 | column,
|
124 | message: reason,
|
125 | tool: 'POSTCSS',
|
126 | code: code_frame_1.codeFrameColumns(error.source, { start: { line, column } }, { highlightCode: true })
|
127 | });
|
128 | }
|
129 |
|
130 | console.log(message);
|
131 | if (!watch) {
|
132 | process.exit(1);
|
133 | }
|
134 | }
|
135 | }
|
136 | exports.default = transpile;
|
137 |
|
\ | No newline at end of file |