Makepack

MakePack is a command-line interface (CLI) tool that helps you to quickly set up, build, and manage JavaScript, TypeScript, React, and React-TypeScript libraries for use in npm projects. With just a few simple commands, you can generate your own libraries, start a development server, or build and publish your project to the npm repository.

Installation

To install MakePack globally, run the following command:

npm install -g makepack

This will allow you to use the makepack command anywhere in your terminal.

Configuration Files

Previously, the project used separate configuration files for Vite and esbuild:

• vite.config.js
• esbuild.config.js

These files have been removed and replaced with a single configuration file: makepack.js.

makepack.js

The makepack.js file exports a function that takes the previous configuration (prevConfig) and returns a new configuration (newConfig). This allows you to configure both esbuild and Vite in one place.

Example Usage

// filepath: /Volumes/Work Space/makepack/makepack.js
module.exports = function(prevConfig) {
    const newConfig = {
        // ...your new configuration here...
    };
    return newConfig;
};

This approach simplifies the configuration process by consolidating it into a single file.

Commands

create

The create command is used to create a new library project. It initializes the project structure, configures essential files, and sets up the environment for you to start working on your library.

Usage

makepack create

Description

• Creates a new library project by setting up the necessary configurations and boilerplate files.

This command will guide you through the initial setup for your library.

---

serve

The serve command starts a development server for your library, providing you with a live-reload environment where you can test and iterate on your library in real-time. It will load vite.config.js if it exists in the root of the project.

Usage

makepack serve [options]

Options

• -p, --port <number>
  Port number (optional) (default is 5000).

• -e, --root <file>
  Root file (optional) (default is serve.jsx or serve.tsx). The entry point for your application. Specify the main JavaScript/TypeScript file to start the server.

Description

• Starts a local development server for testing and debugging your library.

Example:

makepack serve --port 4000 --root src/index.ts

---

pack

The pack command is used to build your library and optionally publish it to the npm repository. This command compiles your code into a distributable format and prepares it for sharing with others. It will load esbuild.config.js if it exists in the root of the project.

Usage

makepack pack [options]

Options

• -e, --entry <file>
  Entry file or directory (default is src/**/*.{tsx,ts,js,jsx}).
  Specify the entry file or use a glob pattern to select the files to include in your library.

• -p, --publish
  Publish the project to the npm repository (default is false).
  Add this flag if you want to publish the library to npm after building it.

Description

• Builds the project by compiling and bundling your library.
• Optionally publishes the library to the npm repository.

Example:

makepack pack --entry src/index.ts --publish

This will compile the project from src/index.ts and then publish the library to npm.

---

Example Workflow

1. Create a new project:

makepack create

2. Start the server for development:

makepack serve --port 4000 --root index.tsx

3. Once you're ready to build and publish your library:

makepack pack --entry src/**/*.{tsx,ts,js,jsx} --publish

This will build your library and publish it to npm.

🤝 Contributing

Contributions are welcome! Please check out the contribution guidelines.

---

📄 License

This project is licensed under the MIT License.

---

📞 Support

For help or suggestions, feel free to open an issue on GitHub or contact us via devnaxrul@gmail.com.