{"id":14976364,"url":"https://github.com/givebest/webpack-multiple-entry","last_synced_at":"2025-09-20T11:32:27.569Z","repository":{"id":22037503,"uuid":"94629316","full_name":"givebest/webpack-multiple-entry","owner":"givebest","description":"基于 webpack 实现的多入口项目脚手架（无JS框架依赖）","archived":false,"fork":false,"pushed_at":"2024-07-12T23:42:54.000Z","size":1407,"stargazers_count":95,"open_issues_count":2,"forks_count":26,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-01-05T20:07:31.355Z","etag":null,"topics":["multiple-entry","webpack","webpack2","webpack3"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/givebest.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":"2017-06-17T14:38:17.000Z","updated_at":"2024-01-16T05:20:18.000Z","dependencies_parsed_at":"2024-09-23T20:01:27.917Z","dependency_job_id":"ff45dff7-238b-4359-a77b-be072a83cd4b","html_url":"https://github.com/givebest/webpack-multiple-entry","commit_stats":{"total_commits":65,"total_committers":5,"mean_commits":13.0,"dds":0.523076923076923,"last_synced_commit":"0828b6928b88d26617acd171d97e1d44a9e8c756"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/givebest%2Fwebpack-multiple-entry","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/givebest%2Fwebpack-multiple-entry/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/givebest%2Fwebpack-multiple-entry/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/givebest%2Fwebpack-multiple-entry/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/givebest","download_url":"https://codeload.github.com/givebest/webpack-multiple-entry/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":233660123,"owners_count":18710025,"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":["multiple-entry","webpack","webpack2","webpack3"],"created_at":"2024-09-24T13:53:46.995Z","updated_at":"2025-09-20T11:32:22.214Z","avatar_url":"https://github.com/givebest.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Webpack multiple entry\n\n基于 webpack 实现的多入口项目脚手架。\n\n主要使用 `extract-text-webpack-plugin` 实现 `js` 、`css` 公共代码提取，`html-webpack-plugin` 实现 `html` 多入口，`less-loader` 实现 `less` 编译，`postcss-loader` 配置 `autoprefixer` 实现自动添加浏览器兼容前缀，删除~~`html-withimg-loader` 实现 `html` 内引入图片版本号添加和模板功能，~~`art-template`实现`html`模板功能，具有 layout 母模板(布局模板)功能更加强大、同时通过修改解析规则界定符支持浏览器端使用 `art-template-web.js`，babel-loader` 实现 `ES6` 转码功能，`imagemin` 实现图片优化压缩， `happypack` 多线程加速构建速度。\n\n## 使用\n\n### 安装\n\n```\nnpm install\n```\n\n### 开发\n\n```\nnpm start\n```\n\u003e http://localhost:8080/view\n\n\n### 构建\n\n| 命令              | 说明           |\n| --------------- | ------------ |\n| `npm run dev`   | 开发环境构建，不压缩代码 |\n| `npm run build` | 生产环境构建，压缩代码  |\n\n\n### art-template\n\n\u003e 项目同时用了 `art-template-loader` 和 `art-template-web.js`，默认情况下模板解析规则界定符会冲突，通过修改 `art-template-web.js` 解析界定符避免冲突。\n\n```javascript\n// 修改 \u003c% %\u003e 为 \u003c? ?\u003e\n// @see http://aui.github.io/art-template/zh-cn/docs/rules.html\nvar rule = template.defaults.rules[0];\nrule.test = new RegExp(rule.test.source.replace('\u003c%', '\u003c\\\\\\?').replace('%\u003e', '\\\\\\?\u003e'));\n```\n\n#### 使用\n\n\u003e 与[原始语法](http://aui.github.io/art-template/zh-cn/docs/syntax.html)保持一致，仅需替换 `\u003c%` 为 `\u003c?` 、`%\u003e` 为 `?\u003e`\n\n##### JavaScript\n```javascript\nimport template from '../commons/template';\n\nvar data = {\n  title: '用户列表',\n  list: [\n    '001',\n    '002',\n    '003',\n    '004',\n    '005'\n  ]\n};\n\nvar html = template('user-list', data);\ndocument.getElementById('wrapper').innerHTML = html;\n```\n\n##### HTML\n```html\n\u003cdiv id=\"wrapper\"\u003e\u003c/div\u003e\n\n\u003cscript id=\"user-list\" type=\"text/html\"\u003e\n\u003ch1\u003e\u003c?= title ?\u003e\u003c/h1\u003e\n\n\u003cul\u003e\n\u003c? for (var i =0; i \u003c list.length; i++) { ?\u003e\n\u003cli\u003e\u003c?= list[i] ?\u003e\u003c/li\u003e\n\u003c? } ?\u003e\n\u003c/ul\u003e\n\u003c/script\u003e\n```\n\n## 目录\n\n```\n├── dist                     # 构建后的目录\n├── config                   # 项目配置文件\n│   ├── webpack.config.js    # webpack 配置文件\n│   └── postcss.config.js    # postcss 配置文件\n├── src                      # 程序源文件\n│   └── js                   # 入口\n│   ├   └── index.js         # 匹配 view/index.html\n│   ├   └── user         \n│   ├   ├    ├── index.js    # 匹配 view/user/index.html\n│   ├   ├    ├── list.js     # 匹配 view/user/list.html\n│   ├   └── lib              # JS 库等，不参与路由匹配\n│   ├       ├── jquery.js \n│   ├   └── commons          # JS 公共模块等，不参与路由匹配\n│   ├       ├── app-callphone.js \n│   └── view                 \n│   ├    └── index.html       # 对应 js/index.js\n│   ├    └── user         \n│   ├        ├── index.html   # 对应 js/user/index.js\n│   ├        ├── list.html    # 对应 js/user/list.js\n│   └── component             # 组件\n│   ├    └── dialog           # Dialog 弹出层组件         \n│   ├    └── other     \n│   └── css                   # css 文件目录\n│   ├    └── base.css          \n│   ├    └── iconfont.css   \n│   └── font                  # iconfont 文件目录\n│   ├    └── iconfont.ttf         \n│   ├    └── iconfont.css\n│   └── img                   # 图片文件目录\n│   ├    └── pic1.jpg         \n│   ├    └── pic2.png     \n│   └── template              # html 模板目录\n│       └── layout.art        # layout 母模板     \n│       └── head.art     \n│       └── foot.art            \n```\n\n## 常见问题\n\n####  MacOS png 图片处理失败\n\n现象：    \n```\nModule build failed: Error: dyld: Library not loaded: /usr/local/opt/libpng/lib/libpng16.16.dylib\n```\n\n解决：     \n`brew install libpng`，详见：https://github.com/tcoopman/image-webpack-loader#libpng-issues\n\n\n## License\n\n[ISC](./LICENSE) © 2017 [givebest](https://github.com/givebest)\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgivebest%2Fwebpack-multiple-entry","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgivebest%2Fwebpack-multiple-entry","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgivebest%2Fwebpack-multiple-entry/lists"}