@flatjs/forge

the lightweight node module compiler of flatjs project architecture

Usage no npm install needed!

<script type="module">
  import flatjsForge from 'https://cdn.skypack.dev/@flatjs/forge';
</script>

README

The build tool @flatjs/forge to pack npm modules of flatjs project architecture

Builtin Presets

  @flatjs/forge-preset-babel

Builtin Plugins

  • Most of the usefull plugins are embedded in the @flatjs/forge as below.
  @flatjs/forge-plugin-multi-input
  @flatjs/forge-plugin-terser
  @rollup/plugin-node-resolve
  @rollup/plugin-commonjs
  @rollup/plugin-json
  @rollup/plugin-replace
  @rollup/plugin-babel

  • You can also add new plugins to extends the forge feature.

The other useful plug-ins

 @flatjs/forge-plugin-postcss-pixel
 @flatjs/forge-plugin-postcss-assets
 @flatjs/forge-plugin-styling

The usage guides

$ npm i @flatjs/forge

Npm scripts sample

Add configuration file flatjs.forge.js into you project root directory.

/** @type import('./').FlatjsPartialConfig */
const flatjsConfig = {
  flatjsForge: {},
};

module.exports = flatjsConfig;

Prepare the npm scripts in package.json as below samples

{
  "scripts": {
    "build": "flatjs-forge --format=cjs --minify --silent",
    "build": "flatjs-forge --version(--v)",
    "build": "flatjs-forge --help(--h)",
    "build": "flatjs-forge version",
    "build": "flatjs-forge help",
    "build": "flatjs-forge help build",
    "build": "flatjs-forge build --h",
    "build": "flatjs-forge build --format=cjs --format=esm --dts",
    "build": "flatjs-forge dtsBuild"
  }
}

Run npm scripts, Enjoy!

$ npm run build

CLI usage sample

Redirect into the root folder of your npm module.

cd ${projectCwd}

Run cli command line as below

$ flatjs-forge build --esm --cjs --minify

Programing usage sample

import minimist from 'minimist';
import {startBuild, startDtsBuild}  from '@flatjs/forge'
// preparing process arguments
export const getProcessArgs = (): minimist.ParsedArgs => {
  return minimist(process.argv.slice(2));
};
// write you owned build logics
export const myStartBuild = (): Promise<string> => {
  const options = getProcessArgs();
  const repoCwd = process.cwd();
  // if you using lerna to manage your projects.
  const projectCwd = join(repoCwd, 'packages', options.name);
  return startBuild(projectCwd, repoCwd).then(() => {
    return projectCwd;
  });
};

// Run build, waiting...
myStartBuild()
  .then((projectCwd) => {
    startDtsBuild(projectCwd)
      .then(() => {
        console.log(`${chalk.green('✔')} Compile ${chalk.cyan.bold(basename(projectCwd))} successfully!\n`);
      })
      .catch((err) => {
        console.log(`${chalk.red('✖')} Compile ${chalk.cyan.bold(basename(projectCwd))} error!\n`, err);
      });
  })
  .catch((err) => {
    const options = getProcessArgs();
    console.log(`${chalk.red('✖')} Compile ${options.name as string} error!\n`, err);
  });

The more detailed tutorials

please see the test case [Tests Cases] (https://www.flatjs.com/blog)

Notes:

Cause of some of @rollup/* plugins use @rollup/pluginutils@^3.1.0 it used @types/estree@0.0.39 which breaks @types/eslint, temporary solution is manaully install @types/estree to ^0.0.45