# @pixelart/packmule

> Stubborn configuration generator for webpack.

Latest version **1.0.0** (published 2019-03-07) · MIT license · 0 weekly downloads

## Install

```sh
npm install @pixelart/packmule
pnpm add @pixelart/packmule
yarn add @pixelart/packmule
bun add @pixelart/packmule
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2019-03-07 |
| First published | 2019-02-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Node | >=10.0.0 |
| Dependencies | 36 |
| Unpacked size | 73.7 KB |
| Known vulnerabilities | 0 (+2 in 2 direct dependencies) |
| Install scripts | no |
| GitHub stars | 5 |
| Author | Thomas Deinhamer |
| Maintainers | thasmo |
| Keywords | webpack, configuration, generator |

## Links

- npm: https://www.npmjs.com/package/@pixelart/packmule
- Repository: https://github.com/packmule/packmule
- Homepage: https://github.com/packmule/packmule#readme
- Issues: https://github.com/packmule/packmule/issues
- npm.io page: https://npm.io/package/@pixelart/packmule

## Dependencies (36)

- [fibers](https://npm.io/package/fibers.md) ^3.1.1
- [iltorb](https://npm.io/package/iltorb.md) ^2.4.1
- [pkg-dir](https://npm.io/package/pkg-dir.md) ^3.0.0
- [ts-loader](https://npm.io/package/ts-loader.md) ^5.3.3
- [css-loader](https://npm.io/package/css-loader.md) ^2.1.0
- [micromatch](https://npm.io/package/micromatch.md) 3.1.10
- [vue-loader](https://npm.io/package/vue-loader.md) ^15.7.0
- [webpackbar](https://npm.io/package/webpackbar.md) ^3.1.5
- [workbox-sw](https://npm.io/package/workbox-sw.md) ^3.6.3
- [eventsource](https://npm.io/package/eventsource.md) ^1.0.7
- [file-loader](https://npm.io/package/file-loader.md) ^3.0.1
- [sass-loader](https://npm.io/package/sass-loader.md) ^7.1.0
- [babel-loader](https://npm.io/package/babel-loader.md) ^8.0.5
- [style-loader](https://npm.io/package/style-loader.md) ^0.23.1
- [script-loader](https://npm.io/package/script-loader.md) ^0.7.2
- [webpack-merge](https://npm.io/package/webpack-merge.md) ^4.2.1
- [postcss-loader](https://npm.io/package/postcss-loader.md) ^3.0.0
- [stylelint-scss](https://npm.io/package/stylelint-scss.md) ^3.5.4
- [imagemin-mozjpeg](https://npm.io/package/imagemin-mozjpeg.md) ^8.0.0
- [promise-polyfill](https://npm.io/package/promise-polyfill.md) ^8.1.0
- [webpack-notifier](https://npm.io/package/webpack-notifier.md) ^1.7.0
- [imagemin-pngquant](https://npm.io/package/imagemin-pngquant.md) ^7.0.0
- [svg-sprite-loader](https://npm.io/package/svg-sprite-loader.md) ^4.1.3
- [clean-webpack-plugin](https://npm.io/package/clean-webpack-plugin.md) ^1.0.0
- [webpack-pwa-manifest](https://npm.io/package/webpack-pwa-manifest.md) ^4.0.0
- [terser-webpack-plugin](https://npm.io/package/terser-webpack-plugin.md) ^1.2.3
- [webpack-dev-middleware](https://npm.io/package/webpack-dev-middleware.md) ^3.6.0
- [webpack-hot-middleware](https://npm.io/package/webpack-hot-middleware.md) ^2.24.2
- [workbox-webpack-plugin](https://npm.io/package/workbox-webpack-plugin.md) ^3.6.3
- [imagemin-webpack-plugin](https://npm.io/package/imagemin-webpack-plugin.md) ^2.4.1
- [mini-css-extract-plugin](https://npm.io/package/mini-css-extract-plugin.md) ^0.5.0
- [webpack-assets-manifest](https://npm.io/package/webpack-assets-manifest.md) ^3.1.1
- [stylelint-webpack-plugin](https://npm.io/package/stylelint-webpack-plugin.md) ^0.10.5
- [compression-webpack-plugin](https://npm.io/package/compression-webpack-plugin.md) ^2.0.0
- [external-svg-sprite-loader](https://npm.io/package/external-svg-sprite-loader.md) ^4.0.1
- [optimize-css-assets-webpack-plugin](https://npm.io/package/optimize-css-assets-webpack-plugin.md) ^5.0.1

## Alternatives

- [jsforce](https://npm.io/package/jsforce.md) — 851.2K weekly downloads
- [react-native-qrcode-svg](https://npm.io/package/react-native-qrcode-svg.md) — 693.5K weekly downloads
- [@salesforce/plugin-data](https://npm.io/package/@salesforce/plugin-data.md) — 394.9K weekly downloads
- [@backstage/plugin-search-common](https://npm.io/package/@backstage/plugin-search-common.md) — 308.5K weekly downloads
- [@chain-registry/types](https://npm.io/package/@chain-registry/types.md) — 38.4K weekly downloads

## Recent versions

- 1.0.0 (latest) — 2019-03-07
- 1.1.0-dev.1 (next) — 2019-04-03
- 1.0.0-1 — 2019-03-04
- 1.0.0-0 — 2019-02-15

## README

# packmule 📦 🐴
> Stubborn configuration generator for webpack.

`packmule` is an opinionated, plugin-based configuration-generator for [`webpack`](https://webpack.js.org/).

**Biased Features**
* Various `webpack` options are pre-configured to work with HTTP2 at an optimum by default.
* Bundled `packs` have been developed and tested for specific use cases.

**Supported Functionality**
* Replace any bundled `pack` with your own custom `pack`.
* Add your own `pack` to generate custom `webpack` configuration.
* Use the bundled `raw` pack to add custom `webpack` configuration directly.

## Installation

Run the following command within your project directory to install `packmule`.
```
npm install --save-dev @pixelart/packmule
```

## Example

```ts
import Packmule, {
    EntryPack,
    OutputPack,
    SassPack,
    TypeScriptPack,
    CompressionPack,
} from '@pixelart/packmule';

const packmule = new Packmule(mode);
packmule.register(new EntryPack('main.ts'));
packmule.register(new OutputPack('public/', '/'));
packmule.register(new SassPack());
packmule.register(new TypeScriptPack());

if (mode === 'production') {
    packmule.register(new CompressionPack());
}

return packmule.generate();
```

`packmule` will generate the following configuration for `webpack` on the fly, running `webpack --mode production`; it's simplified and shortened to make it more readable.

<details>
  <summary>Generated webpack configuration</summary>

```ts
{
    mode: 'production',
    cache: false,
    entry: {
        main: ['source/main.ts'],
    },
    output: {
        path: '/public',
        publicPath: '/',
        filename: '[name].[contenthash:8].js',
        chunkFilename: 'chunks/[name].[contenthash:8].js',
    },
    resolve: {
        extensions: ['.json', '.scss', '.sass', '.ts', '.tsx'],
    },
    plugins: [
        HashedModuleIdsPlugin,
        MiniCssExtractPlugin,
        CompressionPlugin,
    ],
    optimization: {
        splitChunks: {
            minSize: 0,
            minChunks: 1,
        },
        minimizer: [
            TerserPlugin,
            OptimizeCssAssetsWebpackPlugin,
        ],
    },
    module: {
        rules: [
            {
                test: /\.s[ac]ss$/,
                use: ['node_modules/mini-css-extract-plugin/dist/loader.js',
                    {
                        loader: 'css-loader',
                        options: {
                            sourceMap: false,
                        },
                    },
                    {
                        loader: 'postcss-loader',
                        options: {
                            sourceMap: false,
                        },
                    },
                    {
                        loader: 'sass-loader',
                    },
                ],
            },
            {
                test: /\.tsx?$/,
                use: [{
                        loader: 'babel-loader',
                        options: {
                            cacheDirectory: false,
                        },
                    },
                    {
                        loader: 'ts-loader',
                        options: {
                            logLevel: 'warn',
                            transpileOnly: true,
                            onlyCompileBundledFiles: true,
                            compilerOptions: {
                                sourceMap: false,
                            },
                        },
                    },
                ],
            },
        ],
    },
}
```
</details>

[**Documentation**](docs/index.md)

## License

[MIT](https://choosealicense.com/licenses/mit/)

---

<img src="https://www.pixelart.at/fileadmin/images/logo-new/logo.svg" width="150">

---
_Source: https://npm.io/package/@pixelart/packmule · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._