|
| 1 | +const {existsSync, lstatSync} = require("fs"); |
| 2 | +const {resolve, dirname} = require("path"); |
| 3 | + |
| 4 | +function isRelativeImport(path){ |
| 5 | + return path.startsWith("."); |
| 6 | +} |
| 7 | + |
| 8 | +function isDirectory(path) { |
| 9 | + return existsSync(path) && lstatSync(path).isDirectory(); |
| 10 | +} |
| 11 | + |
| 12 | +function resolveImport (from, to) { |
| 13 | + return resolve(dirname(from), to); |
| 14 | +} |
| 15 | + |
| 16 | +function replaceDirectoryImports() { |
| 17 | + return { |
| 18 | + visitor: { |
| 19 | + ImportDeclaration: (path, state) => { |
| 20 | + const importPath = path.node.source.value; |
| 21 | + const fileName = state.file.opts.filename; |
| 22 | + if (isRelativeImport(importPath) && isDirectory(resolveImport(fileName, importPath))) { |
| 23 | + path.node.source.value += "/index"; |
| 24 | + } |
| 25 | + } |
| 26 | + } |
| 27 | + } |
| 28 | +} |
| 29 | + |
| 30 | + |
| 31 | +// This config will output files to ./src/gen/components via the `yarn components` script |
| 32 | +// See https://shadow-cljs.github.io/docs/UsersGuide.html#_javascript_dialects |
| 33 | +module.exports = { |
| 34 | + presets: [ |
| 35 | + "@babel/env", |
| 36 | + // Compile tsx files. |
| 37 | + "@babel/preset-typescript", |
| 38 | + // Use the react runtime import if available. |
| 39 | + ["@babel/preset-react", {"runtime": "automatic"}] |
| 40 | + ], |
| 41 | + plugins: [ |
| 42 | + // Add /index to all relative directory imports, because Shadow-CLJS does not support |
| 43 | + // them (https://github.com/thheller/shadow-cljs/issues/841#issuecomment-777323477) |
| 44 | + // NB: Putting these files in node_modules would have fixed the directory imports |
| 45 | + // but broken hot reload (https://github.com/thheller/shadow-cljs/issues/764#issuecomment-663064549) |
| 46 | + replaceDirectoryImports, |
| 47 | + // Allow using @/ for root relative imports in the component library. |
| 48 | + ["module-resolver", {alias: {"@": "./src/js/components"}}], |
| 49 | + // Transform material-ui imports into deep imports for faster reload. |
| 50 | + // material-ui is very big, and importing it all can slow down development rebuilds by a lot. |
| 51 | + // https://material-ui.com/guides/minimizing-bundle-size/#development-environment |
| 52 | + ["transform-imports", { |
| 53 | + "@material-ui/core": { |
| 54 | + transform: "@material-ui/core/esm/${member}", |
| 55 | + preventFullImport: true |
| 56 | + }, |
| 57 | + "@material-ui/icons": { |
| 58 | + transform: "@material-ui/icons/esm/${member}", |
| 59 | + preventFullImport: true |
| 60 | + } |
| 61 | + }], |
| 62 | + // Our build doesn't need the {loose: true} option, but if not included it wil |
| 63 | + // show a lot of warnings on the storybook build. |
| 64 | + ["@babel/proposal-class-properties", {loose: true}], |
| 65 | + ["@babel/proposal-object-rest-spread", {loose: true}], |
| 66 | + // Used only by storybook, but must be included to avoid build warnings/errors. |
| 67 | + ["@babel/plugin-proposal-private-methods", {loose: true}], |
| 68 | + ["@babel/plugin-proposal-private-property-in-object", {loose: true}], |
| 69 | + // Import helpers from @babel/runtime instead of duplicating them everywhere. |
| 70 | + "@babel/plugin-transform-runtime", |
| 71 | + // Better debug information for styled components. |
| 72 | + // https://styled-components.com/docs/tooling#babel-plugin |
| 73 | + "babel-plugin-styled-components" |
| 74 | + ], |
| 75 | + // Do not apply this babel config to node_modules. |
| 76 | + // Shadow-CLJS also runs babel over node_modules and we don't want this |
| 77 | + // configuration to apply to it. |
| 78 | + // We still want it to be picked up by storybook though. |
| 79 | + exclude: ["node_modules"] |
| 80 | +} |
1 commit comments
vercel[bot] commentedon Sep 16, 2021
Successfully deployed to the following URLs: