Features

Backpack with the following added features:

• [x] TypeScript using (ts-loader)
• [x] DotENV using (dotenv-webpack)

Installation

Either through cloning with git or by using yarn (the recommended way):

yarn global add @boringcodes/backpack

And backpack will be installed globally to your system path.

You can also install backpack as a repository dependency:

yarn add @boringcodes/backpack

and add the following scripts to your package.json like this:

{
  "scripts": {
    "dev": "backpack dev",
    "build": "backpack build"
  }
}

After that there are just a few ~~conventions~~ defaults:

• src/index.ts: the entry of your app.

...actually that's it.

You can then run your application in development mode:

yarn run dev

Or build source by the following command:

yarn run build

Custom configuration

For custom advanced behavior, you can create a backpack.config.js in the root of your project's directory (next to package.json).

// backpack.config.js
// IMPORTANT: This file is not going through babel transformation.
// You can however use the ES2015 features supported by your Node.js version.
module.exports = {
  /* config options here */
};

Customizing webpack config

Example

To extend webpack, you can define a function that extends its config via backpack.config.js.

// backpack.config.js
module.exports = {
  webpack: (config, options, webpack) => {
    // Perform customizations to config
    // Important: return the modified config
    return config;
  },
};

Building for Production

Add a npm script for the build step:

{
  "scripts": {
    "dev": "backpack",
    "build": "backpack build"
  }
}

Then run the build command and start your app

yarn run build
node ./build/index.js

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

Authors

BoringCodes

License

MIT