Webpack-dependency-suite NPM

Webpack Dependency Suite

A set of loaders, plugins and utilities designed to help with adding custom dependencies to your project.

Usage

TODO.

Parts of the Suite

`require.include` loaders

These are a bit like baggage-loader but more configurable and advanced.

comment-include-loader:

    /* @import */ 'module'
    /* @import @lazy @ */ 'module'
    /* @import('thing\/*\/also\/works') @lazy @ */ 'module' // <<- globs will not work in comments cause of /**/ unless you escape slashes

conventional-include-loader (include related files according to passed in function(fs)) eg. like-named require loader for .html files
template require loader (and others - configurable?) ${} globbing by: - splitting path by '/' - find first component where * is - resolve previous one || contextDir - get all files recursively - split their paths '/' - add all that match the regex
explicit loader: adds all dependencies listed in a JSON file to a given, individual file (entry?) expose a method to check if a path should override/add loaders by query configuration
note: globbed paths MUST include extensions

Resolve Plugins

resolve plugin for trying nested directories auto-resolve stuff (e.g. Aurelia's /dist/es2015)
resolve plugin to use root module from node_modules if version range satisfied

Normal Use Plugins

mapped relative moduleId plugin sets ModuleID: - use relative to any of config.modules (node_modules, app) - no JS extensions - rewrite paths for aurelia (strip /dist/node_modules/) - strip nested node_modules/.../node_modules - just do: package_name/request - for /index do package_name - name loader-based modules with a prefix: LOADER!NAME - aurelia loader checks cache for normal module name, then for async!NAME sets module.id relative to configured directory optionally keeps extension (.js .ts)

Development / Debugging

There are two scripts that are setup already:

npm run dev
- will run the same configuration instead with webpack-dev-server for live reload
npm run build
- will simply execute a webpack build in the repo
npm run debug will run the same build with node debugger. paste provided link in Chrome (or Canary), and you will have the super incredible ChromeDevTools to step through your code for learning, exploration, and debugging.