{"id":16295058,"url":"https://github.com/niieani/node-webpackify","last_synced_at":"2025-03-16T13:31:37.648Z","repository":{"id":47151064,"uuid":"131768362","full_name":"niieani/node-webpackify","owner":"niieani","description":"Just like babel-register, but using all the loaders, resolvers and aliases from webpack","archived":false,"fork":false,"pushed_at":"2023-12-15T02:56:12.000Z","size":130,"stargazers_count":50,"open_issues_count":1,"forks_count":3,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-03-07T16:55:11.518Z","etag":null,"topics":["node","webpack"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/niieani.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-05-01T22:11:00.000Z","updated_at":"2024-05-04T19:17:47.000Z","dependencies_parsed_at":"2024-10-10T20:17:32.120Z","dependency_job_id":"f8521160-2cca-4cdc-987c-a3fb7b570e86","html_url":"https://github.com/niieani/node-webpackify","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/niieani%2Fnode-webpackify","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/niieani%2Fnode-webpackify/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/niieani%2Fnode-webpackify/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/niieani%2Fnode-webpackify/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/niieani","download_url":"https://codeload.github.com/niieani/node-webpackify/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243817290,"owners_count":20352531,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["node","webpack"],"created_at":"2024-10-10T20:17:30.218Z","updated_at":"2025-03-16T13:31:37.225Z","avatar_url":"https://github.com/niieani.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# node-webpackify\n\nRedirects all your Node `require()` calls to Webpack's module compiler,\nmaking it into a JIT (just-in-time) compiler.\n\nIt can serve as a replacement for `babel-register` or `ts-node`.\n\nBased on the provided `webpack` config, `node-webpackify` will use:\n- `webpack`'s resolvers (including resolving of aliases, resolve plugins, etc.)\n- `webpack`'s rules (loaders)\n\nBut NOT webpack's plugins (or at least that remains untested)!\nThe reason is that `node-webpackify` will only run a handful of hooks required to setup the resolvers and loaders.\n\nYes, this means you can use things like `css-loader` with Node or Electron.\nThink: ditching `karma-webpack` in place of `electron-mocha` for much faster testing.\n\n## Usage\n\n`node-webpackify` exposes a `register` function, which you can use by calling it with the following arguments:\n\n```js\nconst webpackOptions = require('./webpack.config.js')\nrequire('node-webpackify')(\n  // webpack options object:\n  webpackOptions,\n  // node-webpackify options object (optional):\n  {\n    // (optional) function(request: string, parentPath: string): boolean\n    // can be used to limit which requests are run through the resolvers and loaders\n    // when left undefined,\n    //\n    // @param request is the string passed into: require(request)\n    // @param parentPath is the full, absolute path to the module that the request is located in\n    test: (request: string, parentPath: string): boolean =\u003e true,\n\n    testTransform: (filename: string, loaders: Array\u003cLoader\u003e, request: string, parentFilename: string): boolean =\u003e true,\n\n    // (optional) override webpack's target (default = 'node'), useful for Electron\n    target,\n  }\n)\n```\n\nI'd recommend creating a `register-webpack.js` file with similar contents to the file above.\n\nThen, you can simply run your code by executing:\n\n```bash\nnode -r ./register-webpack src/entry\n```\n\n### Output code must be valid NodeJS code\n\nYou need to ensure *none* of the output code contains ES6 `import`s (whether static or dynamic).\n\nIf using Babel or TypeScript, ensure you set a CommonJS target for the module system.\n\nIf you use dynamic `import()`s, you could add a babel plugin to transpile them into promisified `require()`s:\n- https://github.com/airbnb/babel-plugin-dynamic-import-node\n\n## Why?\n\n- NodeJS-based testing without mocking non-JS files,\n  e.g. running `jest` or `mocha` under Electron (which is Node + Chromium):\n    - no build/rebuild step necessary\n    - native watch mode\n    - test your (post)CSS/SASS/CSSinJS *with* measuring and rendering, but *without* bundling\n- one config to rule them all: why should you need a different config for your testing platform,\nand a different one for your production?\n- run a Node REPL that uses your webpack configuration (resolvers, loaders, aliases),\nand behaves like webpack (supporting inline syntax like `require('!graphql-loader!./schema.graphql')`)\n- debug your `serverless` functions without `serverless-webpack`: no bundles, no sourcemap mess, no rebuilding!\n- things I didn't even think of 😄.\n- [Edit this README](https://github.com/niieani/node-webpackify/edit/master/README.md) if you have an interesting use-case!\n\n## ES6 modules support\n\n`node-webpackify` does not add hooks to the ES6 modules system when the `--experimentalModules` flag is enabled.\n\nIt shouldn't be too hard to add, as there are official APIs for hooking into that system.\nIf you want to give it a go, send me a PR! :-)\n\n## Performance\n\nWe're transforming and loading each file on-demand, while all `require` calls are synchronous.\nUnfortunately this means any top-level `require`s will cascade down making the boot-up of your application slow.\n\nThe way to solve this problem is to delay the `import`s as much as possible, which could be achieved using a babel plugin (explained below).\nIt's likely not all codepaths in your application will be taken,\nmeaning some files can be unnecessary, and others could be transformed and loaded just-in-time for their first use.\n\nThis is really important in node, because `require` is synchronous, and cannot be parallelized.\nIf you `require` any file and that contains top-level `require`s or static `import`s,\nall of those files, and all of *their* dependencies will have to be resolved and transformed before any other code is executed.\n\nIf you're using `babel`, I recommend adding one of these plugins to the config passed into `node-webpackify` (it might not make sense in other cases):\n- https://github.com/zertosh/babel-plugin-transform-inline-imports-commonjs\n- https://github.com/princjef/babel-plugin-lazy-require\n\nThey will make your `require`'s evaluate at the first moment they're used,\nrather than all upfront, making the start-up times much, much better.\n\nYou could even try experimenting with transpiling the `node_modules` code with these, to get even better boot times!\n\n### Open PRs with improvements!\n\nSince loaders can be slow, and `require`'s are synchronous, a lot could still be done to make `node-webpackify` faster:\n- long-term caching based on file timestamps (like `babel-register`)\n- improving logic for early bailing\n- resolve-only before creating the Webpack module\n- profile, find and eliminate bottlenecks!\n\n## Debugging\n\nLunch your app with a `DEBUG=node-webpackify:*` environment variable, e.g.:\n\n```bash\nDEBUG=node-webpackify:* node -r ./register-webpack src/entry\n```\n\n## Using the compiler directly\n\nIt might be useful for you to just use the extracted compiler,\nfor example to write a `jest` transform plugin out of it.\n\nSee the `src/compiler.test.ts` for details on usage.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fniieani%2Fnode-webpackify","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fniieani%2Fnode-webpackify","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fniieani%2Fnode-webpackify/lists"}