index.js 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. import { transformSync } from '@babel/core'
  2. import babelPluginreactCssModules from 'babel-plugin-react-css-modules'
  3. import path, { resolve } from 'node:path'
  4. import fs from 'node:fs'
  5. import { fileURLToPath } from 'url'
  6. const __filename = fileURLToPath(import.meta.url)
  7. const __dirname = path.dirname(__filename)
  8. function reactCssModule(config) {
  9. console.log('reactCssModule')
  10. console.log(resolve(__dirname, 'trans.js'))
  11. return {
  12. name: 'custom-react-css-module',
  13. transform(code, id) {
  14. if (!/\.(t|j)sx?$/.test(id) || id.includes('node_modules'))
  15. return
  16. if (!id.endsWith('x') && !code.includes('react'))
  17. return
  18. const parserPlugins = ['jsx', 'importMeta']
  19. if (/\.tsx?$/.test(id))
  20. parserPlugins.push('typescript', 'decorators-legacy')
  21. const isReasonReact = id.endsWith('.bs.js')
  22. const result = transformSync(code, {
  23. babelrc: false,
  24. configFile: false,
  25. filename: id,
  26. parserOpts: {},
  27. plugins: [
  28. [babelPluginreactCssModules, {
  29. autoResolveMultipleImports: true,
  30. exclude: 'node_modules',
  31. ...config
  32. }]
  33. ],
  34. ast: !isReasonReact,
  35. sourceMaps: true,
  36. sourceFileName: id,
  37. })
  38. fs.writeFileSync(resolve(__dirname, 'trans.js'), result.code)
  39. return {
  40. code: result.code,
  41. map: result.map
  42. }
  43. }
  44. }
  45. }
  46. export default reactCssModule