Skip to content

πŸ“¦ webpack: Multiple entry points with glob pattern - Partial files named with a leading underscore - Preserve directory structure in dist directory

License

Notifications You must be signed in to change notification settings

sectsect/webpack-sweet-entry

Repository files navigation

@sect/webpack-sweet-entry

Test codecov CodeQL npm version MIT license

Multiple entry points with glob pattern / Partial files with underscore / Preserve directory structure

Install

npm install --save-dev @sect/webpack-sweet-entry

Features

  • Multiple entry points with glob pattern.
  • Partial files (Files and Directories named with a leading underscore _ is ignored.).
  • Preserve directory structure in dist directory.

Usage Example

const webpack = require('webpack');
const path = require('path');
const { WebpackSweetEntry } = require('@sect/webpack-sweet-entry');

const sourcePath = path.join(__dirname, 'src');
const buildPath = path.join(__dirname, 'dist');

module.exports = [
  {
    entry: WebpackSweetEntry(path.resolve(sourcePath, 'assets/js/**/*.js*'), 'js', 'js'),
    output: {
      path: path.resolve(buildPath, 'assets/js'),
      filename: '[name].js',
    },
    module: {
      ...
    }
  },
  {
    entry: WebpackSweetEntry(path.resolve(sourcePath, 'assets/css/**/*.css'), 'css', 'css'),
    output: {
      path: path.resolve(buildPath, 'assets/css'),
      filename: '[name].css',
    },
    module: {
      ...
    }
  }
];

Multiple(Mixed) extentions

module.exports = [
  {
    entry: WebpackSweetEntry(path.resolve(sourcePath, 'assets/scripts/**/*.*s*'), ['ts', 'js'], 'scripts'),
    output: {
      path: path.resolve(buildPath, 'assets/js'),
      filename: '[name].js',
    },
    module: {
      ...
    }
  },
  ...
];

API

WebpackSweetEntry(path, ext, parentdir);
arg type Description Example
path string | string[] File path glob(s) path.resolve(sourcePath, 'assets/js/**/*.js*') or [path.resolve(sourcePath, 'assets/js/**/*.js*'), '!**/a.js']
ext string | string[] File extension js or ['ts', 'js']
parentdir string Parent Dirctory Name for files (The directory name where the tree starts) js

Returns object like the following.

{
  a: '/path/to/your/src/assets/js/a.js',
  b: '/path/to/your/src/assets/js/b.js',
  'dir/e': '/path/to/your/src/assets/js/dir/e.js'
}
{
  a: '/path/to/your/src/assets/css/a.css',
  b: '/path/to/your/src/assets/css/b.css',
  'dir/e': '/path/to/your/src/assets/css/dir/e.css'
}

Build Result

.
β”œβ”€β”€ dist
β”‚   └── assets
β”‚       β”œβ”€β”€ css
β”‚       β”‚   β”œβ”€β”€ a.css
β”‚       β”‚   β”œβ”€β”€ b.css
β”‚       β”‚   └── dir
β”‚       β”‚       └── e.css
β”‚       └── js
β”‚           β”œβ”€β”€ a.js
β”‚           β”œβ”€β”€ b.js
β”‚           └── dir
β”‚               └── e.js
β”œβ”€β”€ src
β”‚   └── assets
β”‚       β”œβ”€β”€ css
β”‚       β”‚   β”œβ”€β”€ a.css
β”‚       β”‚   β”œβ”€β”€ b.css
β”‚       β”‚   β”œβ”€β”€ _c.css
β”‚       β”‚   β”œβ”€β”€ _d.css
β”‚       β”‚   └── dir
β”‚       β”‚       β”œβ”€β”€ e.css
β”‚       β”‚       └── _f.css
β”‚       └── js
β”‚           β”œβ”€β”€ a.js
β”‚           β”œβ”€β”€ b.js
β”‚           β”œβ”€β”€ _c.js
β”‚           β”œβ”€β”€ _d.js
β”‚           β”œβ”€β”€ _modules
β”‚           β”‚   β”œβ”€β”€ a.js
β”‚           β”‚   └── b.js
β”‚           └── dir
β”‚               β”œβ”€β”€ e.js
β”‚               └── _f.js
β”œβ”€β”€ package-lock.json
β”œβ”€β”€ package.json
β”œβ”€β”€ postcss.config.js
└── webpack.config.js

Migrate from v1

$ npm uninstall webpack-sweet-entry
$ npm install --save-dev @sect/webpack-sweet-entry
- const WebpackSweetEntry = require('webpack-sweet-entry');
+ const { WebpackSweetEntry } = require('@sect/webpack-sweet-entry');

Changelog

See CHANGELOG file.

✌️

A little project by @sectsect