{"id":20226184,"url":"https://github.com/steamerjs/steamer-webpack-utils","last_synced_at":"2025-08-02T00:43:40.190Z","repository":{"id":57370624,"uuid":"75534602","full_name":"steamerjs/steamer-webpack-utils","owner":"steamerjs","description":"steamer webpack utils","archived":false,"fork":false,"pushed_at":"2018-09-01T01:54:30.000Z","size":32,"stargazers_count":1,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-04T13:08:33.751Z","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":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/steamerjs.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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":"2016-12-04T11:58:26.000Z","updated_at":"2018-09-01T01:53:53.000Z","dependencies_parsed_at":"2022-08-29T18:30:54.292Z","dependency_job_id":null,"html_url":"https://github.com/steamerjs/steamer-webpack-utils","commit_stats":null,"previous_names":["steamerteam/steamer-webpack-utils"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/steamerjs/steamer-webpack-utils","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamerjs%2Fsteamer-webpack-utils","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamerjs%2Fsteamer-webpack-utils/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamerjs%2Fsteamer-webpack-utils/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamerjs%2Fsteamer-webpack-utils/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/steamerjs","download_url":"https://codeload.github.com/steamerjs/steamer-webpack-utils/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/steamerjs%2Fsteamer-webpack-utils/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":268320318,"owners_count":24231800,"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","status":"online","status_checked_at":"2025-08-01T02:00:08.611Z","response_time":67,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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-11-14T07:16:39.893Z","updated_at":"2025-08-02T00:43:40.156Z","avatar_url":"https://github.com/steamerjs.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## steamer-webpack-utils\nsteamer 脚手架 webpack utils 函数\n\n[![NPM Version](https://img.shields.io/npm/v/steamer-webpack-utils.svg?style=flat)](https://www.npmjs.com/package/steamer-webpack-utils)\n[![Travis](https://img.shields.io/travis/steamerjs/steamer-webpack-utils.svg)](https://travis-ci.org/steamerjs/steamer-webpack-utils)\n[![Deps](https://david-dm.org/steamerjs/steamer-webpack-utils.svg)](https://david-dm.org/steamerjs/steamer-webpack-utils)\n[![Coverage](https://img.shields.io/coveralls/steamerjs/steamer-webpack-utils.svg)](https://coveralls.io/github/steamerjs/steamer-webpack-utils)\n\n\n### 接口函数\n\n#### 项目目录示例\n\n```javascript\nsrc\n |-- page\n |___|\n |   |-- index\n |   |    |-- main.js\n |   |    |-- index.html\n |   |     \n |   |-- comment\n |   |    |-- main.js\n |   |    |-- index.html\n |   |\n |   |-- detail\n |        |-- main.jsx\n |        |-- index.html\n |        |-- index1.html\n |\n |-- img\n |    |-- sprites\n |          |- button\n |          |- icon\n |\n |\n |-- index.html\n |-- comment.html\n |-- detail.html\n |-- main.js\n```\n\n若你想查看具体接口参数，请参阅 `index.js`\n\n* fs 具备 [fs-extra](https://github.com/jprichardson/node-fs-extra) 的能力\n\n* getHtmlEntry\n\t- 自动获取 `html` 文件\n\t- 参数 `{Object}`\n\t\t- `option.srcPath` `{String}` 包含有 `html` 文件的目录\n\t\t- `option.level` `{Integer}` 0 表示在当前目录寻找，1 表示在下一级目录寻找\n\t\t- `options.keyType` `{String}` 返回 `key` 值的类型， 默认 `folderName` (用父文件夹名作 `key`), 其它值 `fileName`(用文件名作为 `key`)\n\n```javascript\nvar htmlFiles = getHtmlEntry({\n\tsrcPath: path.join(process.cwd(), \"src\")\n});\n\n// 返回\n[ \n\t{ \n\t\tkey: 'comment',\n\t\tpath: 'path/src/comment.html'\n\t},\n\t{ \n\t\tkey: 'detail',\n\t\tpath: 'path/src/detail.html'\n\t},\n\t{ \n\t\tkey: 'index',\n\t\tpath: 'path/src/index.html'\n\t} \n]\n\nvar htmlFiles = getHtmlEntry({\n\tsrcPath: path.join(process.cwd(), \"src/page\"),\n\tlevel: 1\n});\n\n// 返回\n[ \n\t{ \n\t\tkey: 'comment',\n\t\tpath: 'path/src/page/comment/index.html'\n\t},\n\t{ \n\t\tkey: 'detail',\n\t\tpath: 'path/src/page/detail/index.html'\n\t},\n\t{ \n\t\tkey: 'index',\n\t\tpath: 'path/src/page/index/index.html'\n\t} \n]\n\nvar htmlFiles = getHtmlEntry({\n\tsrcPath: path.join(process.cwd(), \"src/page\"),\n\tlevel: 1,\n\tkeyType: 'fileName',\n});\n// 返回\n\n[ \n\t{ \n\t\tkey: 'index',\n    \tpath: 'path/src/page/comment/index.html'\n    },\n  \t{ \n  \t\tkey: 'index',\n    \tpath: 'path/src/page/detail/index.html'\n    },\n    { \n  \t\tkey: 'index1',\n    \tpath: 'path/src/page/detail/index1.html'\n    },\n  \t{ \n  \t\tkey: 'index',\n    \tpath: 'path/src/page/index/index.html'\n    } \n]\n```\n\n* filterHtmlFile\n\t- 筛选 `html` 文件, 通常与 `getHtmlEntry` 一起使用\n\t- 参数\n\t\t- `htmlFiles`, `{Array}`, 所有 `html` 文件\n\t\t- `selectedFiles`, `{Array}`, 选中的 `html` 文件, 支持glob\n\n```javascript\nvar htmlFiles = filterHtmlFile([ \n\t{ \n\t\tkey: 'comment',\n\t\tpath: 'path/src/page/comment/index.html'\n\t},\n\t{ \n\t\tkey: 'detail',\n\t\tpath: 'path/src/page/detail/index.html'\n\t},\n\t{ \n\t\tkey: 'detail-m',\n\t\tpath: 'path/src/page/detail-m/index.html'\n\t},\n\t{ \n\t\tkey: 'index',\n\t\tpath: 'path/src/page/index/index.html'\n\t} \n], ['detail*']);\n\n// 最终返回\n[ \n  \t{ \n  \t\tkey: 'detail',\n    \tpath: 'path/src/page/detail/index.html'\n    },\n  \t{ \n  \t\tkey: 'detail-m',\n    \tpath: 'path/src/page/detail-m/index.html'\n    } \n]\n\n// 如果第二个参数被忽略，则完整返回\nvar htmlFiles = filterHtmlFile([ \n\t{ \n\t\tkey: 'comment',\n    \tpath: 'path/src/page/comment/index.html'\n    },\n  \t{ \n  \t\tkey: 'detail',\n    \tpath: 'path/src/page/detail/index.html'\n    },\n  \t{ \n  \t\tkey: 'index',\n    \tpath: 'path/src/page/index/index.html'\n    } \n]);\n\n// 它返回原有的数组\n[ \n\t{ \n\t\tkey: 'comment',\n    \tpath: 'path/src/page/comment/index.html'\n    },\n  \t{ \n  \t\tkey: 'detail',\n    \tpath: 'path/src/page/detail/index.html'\n    },\n  \t{ \n  \t\tkey: 'index',\n    \tpath: 'path/src/page/index/index.html'\n    } \n]\n```\n\n* filterHtmlFileByCmd\n\t- 根据 npm 命令进行 html 文件的筛选\n\t- 参数\n\t\t- htmlFiles, {Array}, 所有 `html` 文件, 支持glob\n\n```javascript\n// 如果你使用以下命令启动你的脚本，npm run start -- --entry=detail*\nvar htmlFiles = [ \n\t{ \n\t\tkey: 'comment',\n\t\tpath: 'path/src/page/comment/index.html'\n\t},\n\t{ \n\t\tkey: 'detail',\n\t\tpath: 'path/src/page/detail/index.html'\n\t},\n\t{ \n\t\tkey: 'detail-m',\n\t\tpath: 'path/src/page/detail-m/index.html'\n\t},\n\t{ \n\t\tkey: 'index',\n\t\tpath: 'path/src/page/index/index.html'\n\t} \n];\n\nutils.filterHtmlFileByCmd(htmlFiles);\n\n// 返回值如下\n[\n\t{\n\t\tkey: 'detail',\n\t\tpath: 'path/src/page/detail/index.html'\n\t},\n\t{\n\t\tkey: 'detail-m',\n\t\tpath: 'path/src/page/detail-m/index.html'\n\t}\n]\n```\n\n*  getSpriteEntry\n\t- 自动获取合图文件\n\t- 参数,  `{Object}`\n\t\t- `options.srcPath`, `{String}`, 源文件目录\n\n```javascript\nvar spriteFolders = getSpriteEntry('src/img/sprites');\n\n// 返回\n[\n\t{ \n\t\tkey: 'btn',\n\t\tpath: 'path/src/img/sprites/btn'\n\t},\n\t{ \n\t\tkey: 'list',\n\t\tpath: 'path/src/img/sprites/list'\n\t} \n]\n```\n\n* getJsEntry\n - 自动获取 `js` 文件\n - 参数, `{Object}`\n \t- `option.srcPath`, {String}, 包含 `js` 文件的目录\n\t- `option.fileName`, {String}, 主入口文件,默认 `main`\n\t- `option.extensions`, {Array}, 主入口文件可能的后缀，默认 `[\"js\"]`\n\t- `option.keyPrefix`, {String}, 返回对象 `key` 的前缀\n\t- `option.level`, {Integer}, 0 表示在当前目录寻找，1 表示在下一级目录寻找\n\n```javascript\nvar jsFiles utils.getJsEntry({\n\tsrcPath: path.join(process.cwd(), \"src\")\n});\n\n// 返回\n{ \n\tmain: [ 'path/src/main.js') ] \n}\n\nvar jsFiles = utils.getJsEntry({\n\tsrcPath: path.join(process.cwd(), \"src/page\"),\n\tfileName: \"index\",\n\textensions: [\"js\", \"jsx\"],\n\tkeyPrefix: \"js/\",\n\tlevel: 1\n});\n\n// 返回\n{ \n\t'js/comment': [ 'path/src/page/comment/index.js' ],\n\t'js/detail': [ 'path/src/page/detail/index.js' ],\n\t'js/index': [ 'path/src/page/index/index.js' ] \n}\n```\n\n* filterJsFile\n\t- 筛选 js 文件, 通常搭配 `getJsEntry` 或者 `getJsFile` 使用\n\t- 参数\n\t\t- jsFiles, {Object}, 所有 `js` 文件\n\t\t- selectedFiles, {Array}, 选中的 `js` 文件, 支持glob\n\n```javascript\nutils.filterJsFile({ \n\t\t'js/comment': [ 'path/src/page/comment/index.js' ],\n\t\t'js/detail': ['path/src/page/detail/index.js' ],\n\t\t'js/detail-m': ['path/src/page/detail-m/index.js' ],\n\t\t'js/index': [ 'path/src/page/index/index.js' ] \n\t}, \n\t[\"js/detail*\"]\n);\n\n// 最后返回如下\n{ \n\t'js/detail': [ 'path/src/page/detail/index.js' ],\n\t'js/detail-m': [ 'path/src/page/detail-m/index.js' ]\n}\n\n// 如果 selectedFiles 参数被忽略，则完整返回\n```\n\n* filterJsFileByCmd\n\t- 根据 npm 命令进行 js 文件的筛选\n\t- 参数\n\t\t- jsFiles, {Object}, 所有 `js` 文件, 支持glob\n\n```javascript\n// 如果你使用以下命令启动你的脚本，npm run start -- --entry=js/detail*\n\nvar jsFiles = { \n\t'js/comment': [ 'path/src/page/comment/index.js' ],\n\t'js/detail': ['path/src/page/detail/index.js' ],\n\t'js/detail-m': ['path/src/page/detail-m/index.js' ],\n\t'js/index': [ 'path/src/page/index/index.js' ] \n};\n\njsFiles = utils.filterJsFileByCmd(jsFiles);\n\n// 返回值为\n{ \n\t'js/detail': [ 'path/src/page/detail/index.js' ],\n\t'js/detail-m': [ 'path/src/page/detail-m/index.js' ]\n}\n```\n\n* walkAndReplace\n\t- 给目录内文件内容进行替换\n\t- 参数\n\t\t- folder, {String}, 目录路径\n\t\t- extensions, {Array}, 需要替换的文件后缀，如为空数组，则所有文件都要替换\n\t\t- replaceObj, {Object}, 需要替换的标签内容\n\n```javascript\n// 内容标签格式一律为 \u003c% key %\u003e, 以下内容是将目录内所有 js 和 html 文件中的 \u003c% title %\u003e 标签内容替换为 index\n\nutils.walkAndReplace(srcFolder, [\".js\", \".html\"], {title: 'index'});\n\n```\n\n* copyTemplate\n\t- 将模板拷贝到指定位置\n\t- 参数\n\t\t- srcFolder, {String}, 源目录\n\t\t- destFolder, {String}, 目标目录\n```javascript\n\nutils.copyTemplate(TEST_SRC, TEST_DIST);\n\n```\n\n* addPlugins\n\t- 给 `webpack` 配置添加 插件\n\t\n```javascript\n\taddPlugins(webpackConfig, webpackPlugin, webpackPluginConfig);\n```\n\n* getArgvs\n\t- 获取命令行参数\n\t- 参数\n\t\t- `argvs`, `{Object}`, 具体参数，可留空，若留空，则自动返回 `process.argv` 被处理的参数\n\n* getNpmArgvs\n\t- 获取npm命令行参数\n```javascript\n// 如 npm start -- --entry=index\n\nvar npmArgvs = getNpmArgvs();\n\n// npmArgvs.entry 值为 \"index\"\n```\n\n* error\n\t- 报错信息\n\t- 参数\n\t\t- msg, {String}, 报错文本\n\n* info\n\t- 正常信息\n\t- 参数\n\t\t- msg, {String}, 正常文本\n\n* warn\n\t- 警告信息\n\t- 参数\n\t\t- msg, {String}, 警告文本\n\n* success\n\t- 成功信息\n\t- 参数\n\t\t- msg, {String}, 成功文本\n\n* getHtmlFile\n\t- 自动获取 `html` 文件，此 `api` 即将被弃用，请改用 `getHtmlEntry`\n\n```javascript\nvar htmlFiles = getHtmlFile(path.join(process.cwd(), \"src\"));\n\n// it returns\n[\"index\", \"comment\", \"detail\"]\n```\n\n* getJsFile\n\t- 自动获取 `js` 文件，此 `api` 即将被弃用，请改用 `getJsEntry`\n\n```javascript\nvar jsFiles = getJsFile('src', 'page', 'main', ['js', 'jsx']);\n\n// 返回\n{\n\t'js/index': ['xxx/project/src/page/index/main.js'],\n\t'js/comment': ['xxx/project/src/page/comment/main.js'], \n\t'js/detail': ['xxx/project/src/page/index/main.jsx'],\n}\n```\n\n* getSpriteFolder\n\t- 获取合图文件，此 `api` 即将被弃用，请改用 `getSpriteEntry`\n\n```javascript\nvar spriteFolders = getSpriteFolder('src/img/sprites');\n\n// 返回\n['button', 'icon']\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteamerjs%2Fsteamer-webpack-utils","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsteamerjs%2Fsteamer-webpack-utils","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsteamerjs%2Fsteamer-webpack-utils/lists"}