├── .gitignore ├── .idea ├── codeStyles │ └── codeStyleConfig.xml ├── inspectionProfiles │ └── Project_Default.xml ├── jsLibraryMappings.xml ├── misc.xml ├── modules.xml ├── node-webpackify.iml ├── typescript-compiler.xml └── vcs.xml ├── .npmignore ├── LICENSE ├── README.md ├── dist ├── __tests__ │ ├── fixtures.js │ └── fixtures.js.map ├── compiler.js ├── compiler.js.map ├── compiler.test.js ├── compiler.test.js.map ├── hook.js ├── hook.js.map ├── index.js ├── index.js.map ├── module-util.js ├── module-util.js.map ├── util-tests.js ├── util-tests.js.map ├── util-webpack.js ├── util-webpack.js.map ├── util.js └── util.js.map ├── fixtures ├── basic │ └── index.js ├── css │ ├── file.css │ ├── index.js │ ├── register.js │ └── webpack.config.js ├── postcss │ ├── file.css │ ├── file2.css │ ├── index.js │ ├── register.js │ └── webpack.config.js └── raw │ ├── file.txt │ ├── index.js │ ├── register.js │ └── webpack.config.js ├── index.js ├── package.json ├── src ├── __snapshots__ │ └── compiler.test.ts.snap ├── __tests__ │ ├── __snapshots__ │ │ └── fixtures.ts.snap │ └── fixtures.ts ├── compiler.js ├── compiler.test.ts ├── hook.js ├── index.ts ├── module-util.js ├── util-tests.ts ├── util-webpack.ts └── util.ts ├── tsconfig.json └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | # Created by .ignore support plugin (hsz.mobi) 2 | ### Node template 3 | # Logs 4 | logs 5 | *.log 6 | npm-debug.log* 7 | yarn-debug.log* 8 | yarn-error.log* 9 | 10 | # Runtime data 11 | pids 12 | *.pid 13 | *.seed 14 | *.pid.lock 15 | 16 | # Directory for instrumented libs generated by jscoverage/JSCover 17 | lib-cov 18 | 19 | # Coverage directory used by tools like istanbul 20 | coverage 21 | 22 | # nyc test coverage 23 | .nyc_output 24 | 25 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 26 | .grunt 27 | 28 | # Bower dependency directory (https://bower.io/) 29 | bower_components 30 | 31 | # node-waf configuration 32 | .lock-wscript 33 | 34 | # Compiled binary addons (https://nodejs.org/api/addons.html) 35 | build/Release 36 | 37 | # Dependency directories 38 | node_modules/ 39 | jspm_packages/ 40 | 41 | # TypeScript v1 declaration files 42 | typings/ 43 | 44 | # Optional npm cache directory 45 | .npm 46 | 47 | # Optional eslint cache 48 | .eslintcache 49 | 50 | # Optional REPL history 51 | .node_repl_history 52 | 53 | # Output of 'npm pack' 54 | *.tgz 55 | 56 | # Yarn Integrity file 57 | .yarn-integrity 58 | 59 | # dotenv environment variables file 60 | .env 61 | 62 | # next.js build output 63 | .next 64 | 65 | /.cache 66 | /.idea/workspace.xml 67 | /preset 68 | /assets 69 | -------------------------------------------------------------------------------- /.idea/codeStyles/codeStyleConfig.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | -------------------------------------------------------------------------------- /.idea/inspectionProfiles/Project_Default.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 11 | -------------------------------------------------------------------------------- /.idea/jsLibraryMappings.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /.idea/misc.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 10 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.idea/node-webpackify.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/typescript-compiler.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 7 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | /.idea 2 | /src 3 | /fixtures 4 | /preset 5 | /assets 6 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Bazyli Brzóska 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # node-webpackify 2 | 3 | Redirects all your Node `require()` calls to Webpack's module compiler, 4 | making it into a JIT (just-in-time) compiler. 5 | 6 | It can serve as a replacement for `babel-register` or `ts-node`. 7 | 8 | Based on the provided `webpack` config, `node-webpackify` will use: 9 | - `webpack`'s resolvers (including resolving of aliases, resolve plugins, etc.) 10 | - `webpack`'s rules (loaders) 11 | 12 | But NOT webpack's plugins (or at least that remains untested)! 13 | The reason is that `node-webpackify` will only run a handful of hooks required to setup the resolvers and loaders. 14 | 15 | Yes, this means you can use things like `css-loader` with Node or Electron. 16 | Think: ditching `karma-webpack` in place of `electron-mocha` for much faster testing. 17 | 18 | ## Usage 19 | 20 | `node-webpackify` exposes a `register` function, which you can use by calling it with the following arguments: 21 | 22 | ```js 23 | const webpackOptions = require('./webpack.config.js') 24 | require('node-webpackify')( 25 | // webpack options object: 26 | webpackOptions, 27 | // node-webpackify options object (optional): 28 | { 29 | // (optional) function(request: string, parentPath: string): boolean 30 | // can be used to limit which requests are run through the resolvers and loaders 31 | // when left undefined, 32 | // 33 | // @param request is the string passed into: require(request) 34 | // @param parentPath is the full, absolute path to the module that the request is located in 35 | test: (request: string, parentPath: string): boolean => true, 36 | 37 | testTransform: (filename: string, loaders: Array, request: string, parentFilename: string): boolean => true, 38 | 39 | // (optional) override webpack's target (default = 'node'), useful for Electron 40 | target, 41 | } 42 | ) 43 | ``` 44 | 45 | I'd recommend creating a `register-webpack.js` file with similar contents to the file above. 46 | 47 | Then, you can simply run your code by executing: 48 | 49 | ```bash 50 | node -r ./register-webpack src/entry 51 | ``` 52 | 53 | ### Output code must be valid NodeJS code 54 | 55 | You need to ensure *none* of the output code contains ES6 `import`s (whether static or dynamic). 56 | 57 | If using Babel or TypeScript, ensure you set a CommonJS target for the module system. 58 | 59 | If you use dynamic `import()`s, you could add a babel plugin to transpile them into promisified `require()`s: 60 | - https://github.com/airbnb/babel-plugin-dynamic-import-node 61 | 62 | ## Why? 63 | 64 | - NodeJS-based testing without mocking non-JS files, 65 | e.g. running `jest` or `mocha` under Electron (which is Node + Chromium): 66 | - no build/rebuild step necessary 67 | - native watch mode 68 | - test your (post)CSS/SASS/CSSinJS *with* measuring and rendering, but *without* bundling 69 | - one config to rule them all: why should you need a different config for your testing platform, 70 | and a different one for your production? 71 | - run a Node REPL that uses your webpack configuration (resolvers, loaders, aliases), 72 | and behaves like webpack (supporting inline syntax like `require('!graphql-loader!./schema.graphql')`) 73 | - debug your `serverless` functions without `serverless-webpack`: no bundles, no sourcemap mess, no rebuilding! 74 | - things I didn't even think of 😄. 75 | - [Edit this README](https://github.com/niieani/node-webpackify/edit/master/README.md) if you have an interesting use-case! 76 | 77 | ## ES6 modules support 78 | 79 | `node-webpackify` does not add hooks to the ES6 modules system when the `--experimentalModules` flag is enabled. 80 | 81 | It shouldn't be too hard to add, as there are official APIs for hooking into that system. 82 | If you want to give it a go, send me a PR! :-) 83 | 84 | ## Performance 85 | 86 | We're transforming and loading each file on-demand, while all `require` calls are synchronous. 87 | Unfortunately this means any top-level `require`s will cascade down making the boot-up of your application slow. 88 | 89 | The 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). 90 | It's likely not all codepaths in your application will be taken, 91 | meaning some files can be unnecessary, and others could be transformed and loaded just-in-time for their first use. 92 | 93 | This is really important in node, because `require` is synchronous, and cannot be parallelized. 94 | If you `require` any file and that contains top-level `require`s or static `import`s, 95 | all of those files, and all of *their* dependencies will have to be resolved and transformed before any other code is executed. 96 | 97 | If 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): 98 | - https://github.com/zertosh/babel-plugin-transform-inline-imports-commonjs 99 | - https://github.com/princjef/babel-plugin-lazy-require 100 | 101 | They will make your `require`'s evaluate at the first moment they're used, 102 | rather than all upfront, making the start-up times much, much better. 103 | 104 | You could even try experimenting with transpiling the `node_modules` code with these, to get even better boot times! 105 | 106 | ### Open PRs with improvements! 107 | 108 | Since loaders can be slow, and `require`'s are synchronous, a lot could still be done to make `node-webpackify` faster: 109 | - long-term caching based on file timestamps (like `babel-register`) 110 | - improving logic for early bailing 111 | - resolve-only before creating the Webpack module 112 | - profile, find and eliminate bottlenecks! 113 | 114 | ## Debugging 115 | 116 | Lunch your app with a `DEBUG=node-webpackify:*` environment variable, e.g.: 117 | 118 | ```bash 119 | DEBUG=node-webpackify:* node -r ./register-webpack src/entry 120 | ``` 121 | 122 | ## Using the compiler directly 123 | 124 | It might be useful for you to just use the extracted compiler, 125 | for example to write a `jest` transform plugin out of it. 126 | 127 | See the `src/compiler.test.ts` for details on usage. 128 | -------------------------------------------------------------------------------- /dist/__tests__/fixtures.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | const util_tests_1 = require("../util-tests"); 4 | describe('uses a loader', () => { 5 | jest.setTimeout(10000); 6 | it('raw-loader', async () => { 7 | const result = await util_tests_1.runFixture('raw'); 8 | expect(result.failed).toBe(false); 9 | expect(result.stdout).toMatchSnapshot(); 10 | }); 11 | it('css-loader and style-loader', async () => { 12 | const result = await util_tests_1.runFixture('css'); 13 | expect(result.failed).toBe(false); 14 | expect(result.stdout).toMatchSnapshot(); 15 | }); 16 | it('postcss-loader', async () => { 17 | const result = await util_tests_1.runFixture('postcss'); 18 | expect(result.failed).toBe(false); 19 | expect(result.stdout).toMatchSnapshot(); 20 | }); 21 | }); 22 | //# sourceMappingURL=fixtures.js.map -------------------------------------------------------------------------------- /dist/__tests__/fixtures.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"file":"fixtures.js","sourceRoot":"","sources":["../../src/__tests__/fixtures.ts"],"names":[],"mappings":";;AAAA,8CAAwC;AAExC,QAAQ,CAAC,eAAe,EAAE,GAAG,EAAE;IAC7B,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,CAAA;IAEtB,EAAE,CAAE,YAAY,EAAE,KAAK,IAAI,EAAE;QAC3B,MAAM,MAAM,GAAG,MAAM,uBAAU,CAAC,KAAK,CAAC,CAAA;QACtC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACjC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,EAAE,CAAA;IACzC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAE,6BAA6B,EAAE,KAAK,IAAI,EAAE;QAC5C,MAAM,MAAM,GAAG,MAAM,uBAAU,CAAC,KAAK,CAAC,CAAA;QACtC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACjC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,EAAE,CAAA;IACzC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAE,gBAAgB,EAAE,KAAK,IAAI,EAAE;QAC/B,MAAM,MAAM,GAAG,MAAM,uBAAU,CAAC,SAAS,CAAC,CAAA;QAC1C,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACjC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,eAAe,EAAE,CAAA;IACzC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"} -------------------------------------------------------------------------------- /dist/compiler.js: -------------------------------------------------------------------------------- 1 | "use strict"; 2 | Object.defineProperty(exports, "__esModule", { value: true }); 3 | const tslib_1 = require("tslib"); 4 | const webpack_1 = tslib_1.__importDefault(require("webpack/lib/webpack")); 5 | const fs_1 = tslib_1.__importDefault(require("fs")); 6 | const SingleEntryDependency_1 = tslib_1.__importDefault(require("webpack/lib/dependencies/SingleEntryDependency")); 7 | const SingleEntryPlugin_1 = tslib_1.__importDefault(require("webpack/lib/SingleEntryPlugin")); 8 | const util_1 = require("util"); 9 | const util_webpack_1 = require("./util-webpack"); 10 | const deasync = require('deasync'); 11 | /** @typedef {import("webpack").Configuration} Configuration */ 12 | /** 13 | * @typedef {{ 14 | * compile: function(callback : function(Error, string) : void): void, 15 | * filename: string, 16 | * request: string, 17 | * needsTransforming: boolean, 18 | * loaders: Array