{"id":17166436,"url":"https://github.com/pbeshai/d3-webpack-loader","last_synced_at":"2025-07-31T00:35:13.908Z","repository":{"id":66139028,"uuid":"70855629","full_name":"pbeshai/d3-webpack-loader","owner":"pbeshai","description":"Automatically bundle D3 v4 modules under a single `d3` import with D3 Webpack Loader.","archived":false,"fork":false,"pushed_at":"2017-05-11T18:35:17.000Z","size":11,"stargazers_count":3,"open_issues_count":2,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-13T15:12:58.291Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/pbeshai.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":"2016-10-13T23:14:31.000Z","updated_at":"2017-09-06T04:31:46.000Z","dependencies_parsed_at":"2023-03-10T23:39:49.709Z","dependency_job_id":null,"html_url":"https://github.com/pbeshai/d3-webpack-loader","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pbeshai%2Fd3-webpack-loader","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pbeshai%2Fd3-webpack-loader/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pbeshai%2Fd3-webpack-loader/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/pbeshai%2Fd3-webpack-loader/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/pbeshai","download_url":"https://codeload.github.com/pbeshai/d3-webpack-loader/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248732487,"owners_count":21152852,"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":[],"created_at":"2024-10-14T23:05:41.865Z","updated_at":"2025-04-13T15:13:03.372Z","avatar_url":"https://github.com/pbeshai.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# D3 Webpack Loader\n\n[![npm version](https://badge.fury.io/js/d3-webpack-loader.svg)](https://badge.fury.io/js/d3-webpack-loader)\n\n\n# Use at your own risk - I don't think this was a great idea after all.\n\nAutomatically bundle D3 v4 modules under a single `d3` import with D3 Webpack Loader.\n\nIf you are using a subset of the modules provided by the default D3 build or are supplementing the default D3 build with additional modules, consider using D3 Webpack Loader to combine them under a single namespace. This lets you continue using D3 in your code in the familiar `d3.___` format.\n\n### How do I use it?\n\nAfter `npm install`ing a number of d3 modules, you can access them via `d3.___` in your code by importing `d3` with the loader. For instance, if we have installed d3-array, we can do:\n\n```js\nimport d3 from 'd3!';\n\nd3.sum([1, 2, 3, 4]); // === 10\n```\n\n**Important!** Don't forget to include the `!` at the end of the import. That tells webpack to use the `d3-webpack-loader`. If you prefer to be more verbose about it, you can also write the import as:\n\n```js\nimport d3 from 'd3-webpack-loader!';\n```\n\n### Configuration\n\nD3 Webpack Loader automatically figures out which D3 modules you have installed by scanning your module directories (e.g., `node_modules`) for packages that begin with `d3-` and combines them into a single object so you can access them under a single `d3` namespace.\n\nIf you'd like to exclude certain packages that begin with `d3-`, you can specify that in your webpack config under `d3Loader.exclude`:\n\n```js\n// webpack.config.js\nmodule.exports = {\n  ...\n  d3Loader: {\n    exclude: ['d3-dont-load-me', 'd3-i-mean-it']\n  }\n};\n```\n\n### How does it work?\n\nIt essentially does the equivalent of creating a local file that lists all your installed d3 modules and exports them as a single object. For instance, an equivalent manual set up would be if you had a local `d3-combined.js`:\n\n```js\n// d3-combined.js\nimport * as array from 'd3-array';\nimport * as scale from 'd3-scale';\nimport * as selection from 'd3-selection';\n\nexport default Object.assign({},\n  array,\n  scale,\n  selection\n);\n```\n\nAnd you used this in your code like:\n\n```js\nimport d3 from './d3-combined';\n\nd3.sum([1, 2, 3, 4]) // === 10\n```\n\nDoing it manually means you need to update your `d3-combined.js` file every time you install a new D3 module. Instead, you can just use D3 Webpack Loader and `import d3 from 'd3!'` and have it work automatically.\n\n### Server-side Rendering\n\nSadly, this will not work if you are hoping to use server-side rendering, since node doesn't understand importing `'d3!'` \n\n\n## Development\n\nCode is written in old school ES5. No fancy new JS features. I don't know why I did this and I regret it. At least it is pretty brief.\n\n### Testing\n\nTo run tests, you first need to install the test fixtures. Do this by running `npm run test:install`. Then you can run tests:\n\n```\nnpm run test\n```\n\n### Linting\n\nTo lint files, run:\n\n```\nnpm run lint\n```\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpbeshai%2Fd3-webpack-loader","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpbeshai%2Fd3-webpack-loader","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpbeshai%2Fd3-webpack-loader/lists"}