{"id":20714153,"url":"https://github.com/ksky521/inline-webpack-plugin","last_synced_at":"2025-12-12T07:47:48.083Z","repository":{"id":57125711,"uuid":"270921607","full_name":"ksky521/inline-webpack-plugin","owner":"ksky521","description":"webpack inline plugin","archived":false,"fork":false,"pushed_at":"2020-06-12T04:36:01.000Z","size":10,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-18T00:03:20.302Z","etag":null,"topics":["html-webpack-plugin","inline-resource","webpack","webpack-plugin"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ksky521.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-06-09T06:29:51.000Z","updated_at":"2022-06-17T12:22:12.000Z","dependencies_parsed_at":"2022-08-31T08:11:42.993Z","dependency_job_id":null,"html_url":"https://github.com/ksky521/inline-webpack-plugin","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ksky521%2Finline-webpack-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ksky521%2Finline-webpack-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ksky521%2Finline-webpack-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ksky521%2Finline-webpack-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ksky521","download_url":"https://codeload.github.com/ksky521/inline-webpack-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242988235,"owners_count":20217537,"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":["html-webpack-plugin","inline-resource","webpack","webpack-plugin"],"created_at":"2024-11-17T02:29:36.565Z","updated_at":"2025-12-12T07:47:43.027Z","avatar_url":"https://github.com/ksky521.png","language":"JavaScript","readme":"# inline-webpack-plugin\n\nThis is a webpack plugin to embed css/js chunk in the html ([html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) is needed).\n\n## install\n\n```bash\nnpm i @ksky521/inline-webpack-plugin -D\n```\n\n## Usage\n\n```js\n// webpack.config.js\nconst InlineWebpackPlugin = require('@ksky521/inline-webpack-plugin');\nmodule.exports = {\n    mode: 'development',\n    output: {\n        publicPath: 'https://cdn.example.com/assets/',\n        path: __dirname + '/dist',\n        filename: '[name].[hash:8].js'\n    },\n    entry: {\n        main: './main.js',\n        foo: './foo.js',\n        bar: './bar.js',\n        uninline: './uninline.js'\n    },\n    module: {\n        rules: [\n            {test: /\\.html$/, loader: 'html-loader'},\n            {\n                test: /\\.css$/i,\n                use: [MiniCssExtractPlugin.loader, 'css-loader']\n            }\n        ]\n    },\n    plugins: [\n        // ... html-webpack-plugin required!\n        new InlineWebpackPlugin([\n            {\n                test(filepath, chunk) {\n                    if (chunk.name === 'main' \u0026\u0026 /\\.css$/.test(filepath)) {\n                        // only for main.css\n                        return true;\n                    }\n                },\n                attrs: {\n                    ['data-inline-props']: 'test'\n                },\n                placeholder: '\u003c!-- main-css --\u003e'\n            },\n            {\n                test: /(foo|vendors)/\n            },\n            {\n                test(filepath, chunk) {\n                    if (chunk.name === 'bar' \u0026\u0026 /\\.css$/.test(filepath)) {\n                        return true;\n                    }\n                },\n                content: 'hello world',\n                remove: false,\n                placeholder: '\u003c!-- replaceit --\u003e'\n            }\n        ])\n    ]\n};\n```\n\nYou can find this demo in the [example](https://github.com/ksky521/inline-webpack-plugin/tree/master/example) directory and view the output:\n\n```bash\nnpm i\nnpm run test\n```\n\n## Options\n\n-   `test`: `string` | `function` | `RegExp`, when `test` is a function, the parameters of the function are:\n    -   filepath: file path\n    -   chunk: chunk object, chunk.name is chunk name.\n-   `placeholder`: `string`, the placeholder. Default is _the assets tag_.\n-   `content`: `string`, Default is 'undefined'.\n-   `remove`: when it set `false`, the assets tag is not be removed. Default is `true'.\n\n## Debug log\n\nUse [debug](https://www.npmjs.com/package/debug) for log.\n\n```bash\nDEBUG=@ksky521/inline-webpack-plugin\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fksky521%2Finline-webpack-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fksky521%2Finline-webpack-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fksky521%2Finline-webpack-plugin/lists"}