xeira/src/scripts/bundle/rollup/cjs.mjs

One Web Dev stack tool to rule them all

import json from '@rollup/plugin-json'
import {babel} from '@rollup/plugin-babel'
//import babel from '@rollup/plugin-swc'

import externals from 'rollup-plugin-node-externals'
import {nodeResolve} from '@rollup/plugin-node-resolve'
import commonjs from '@rollup/plugin-commonjs'
import scss from 'rollup-plugin-postcss'
import tailwindcss from '@tailwindcss/postcss'
import autoprefixer from 'autoprefixer'

import {rollupBanner} from './commons/banner.mjs'
import {getDynamicImportOptions} from './commons/dynImports.mjs'
import { getRollupPluginForResolvingAliases } from '../../../utils/aliases.mjs'
import { getBabelConfig } from '../../../config/babel.mjs'

async function rollupModulesForCjs(context, pkgJsonPath, pkgJson, input, bundleDeps= false) {

  const customBabelConfig= {
    exclude: /node_modules/,
    /*https://github.com/rollup/plugins/tree/master/packages/babel#babelhelpers*/
    
    // TODO
    //  context.isAnApp()
    //  ? 'runtime' https://github.com/rollup/plugins/tree/master/packages/babel#injected-helpers
    //  : bundled
    
    babelHelpers: 'bundled',

    presets: [
      ["@babel/preset-env", { 
        bugfixes: true,
        loose: true
      }],
      ... context.usesReact
        ? ['@babel/preset-react']
        : []
    ],
    
    plugins: [
      "babel-plugin-transform-import-meta"
    ]

  }

  const mergedBabelConfig= await getBabelConfig(context, input, customBabelConfig)

  const inputOptions= {
    input,
    plugins: [
      babel(mergedBabelConfig), 
      commonjs({
        esmExternals: true,
        //dynamicRequireTargets: true
      }),      
      ...getRollupPluginForResolvingAliases(context.pkgPath),
      json(),
      externals({
        packagePath: pkgJsonPath,
        deps: !bundleDeps,
        peerDeps: !bundleDeps
      }),
      nodeResolve({
        rootDir: context.pkgPath,
        exportConditions: ['node'],
      }),

      scss({
        extract: true,
        plugins: [
          tailwindcss({base: context.pkgPath}),
          autoprefixer()
        ],
        use: {
          sass: {
            silenceDeprecations: ['legacy-js-api'],
          }
        }        
      })
    ],
    onwarn : (warning) => {
      if (warning.code === 'CIRCULAR_DEPENDENCY')    return;
      if (warning.code === 'MODULE_LEVEL_DIRECTIVE') return;
      console.warn(warning.message)
    }
  }

  const output = context.pkgp(
    bundleDeps ?  context.getCjsFullBundleOutput() : context.getCjsOutput()
  )
  
  const outputs= [
    {
      ...getDynamicImportOptions (context, output),
      format: 'cjs',
      exports: 'named',
      banner: rollupBanner(pkgJson)
    }
  ]

  return [inputOptions, outputs]
}


export {
  rollupModulesForCjs
}