# webpack-html
**Repository Path**: dgx/webpack-html
## Basic Information
- **Project Name**: webpack-html
- **Description**: webpack搭建多入口应用
- **Primary Language**: NodeJS
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 0
- **Forks**: 1
- **Created**: 2019-08-12
- **Last Updated**: 2020-12-19
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
# webpack-html
#### 介绍
webpack搭建多入口应用
webpack多入口启动和开发
#### 安装教程
1. git clone https://gitee.com/dgx/webpack-html.git
或
git clone git@gitee.com:dgx/webpack-html.git
2. npm install(依赖应该按照实际需求调整到devDependencies和dependencies)
#### 使用说明
1.1 npm run dev(启动方式1,走webpack-dev-middleware,接入express服务)
1.2 npm run server(启动方式2,走webpack-dev-server,集合服务器)
2. npm run build(构建项目)
#### 说明
1.关于启动
推荐使用指令 npm run dev,
我们这时候会执行 node server.js ,读取 webpack.dev.js 开发环境配置,
使用express服务。
2.关于开发
我们可以读取 webpack.dev.js 的代码,我们逻辑做了开发目录控制,
如果需要开发一个新的项目页面,
我们只需要复制 src/pages/ 下的 index 目录,只保留index.js和index.html即可,
然后在index做各种依赖引入逻辑开发,
3.关于配置
只需要修改 entry.js
当前配置:
module.exports = {
'index': [
"./src/pages/index/index"
],
'login': [
"./src/pages/login/index"
]
}
添加一个test项目页面,加入对应新的配置即可:
module.exports = {
'index': [
"./src/pages/index/index"
],
'login': [
"./src/pages/login/index"
],
'test': [
"./src/pages/test/index"
]
}
4.热更新
如果项目需要热更新处理,在index.js加入如下代码即可
if (module.hot) {
module.hot.accept();
}
#### 其他
src/pages/index(示例demo)
src/pages/iview(iview演示)
src/pages/login(react基础项目)
src/pages/picker(react日历项目)
src/pages/react-demo(react+react-router项目)
src/pages/test(vue基础项目)
src/pages/vue-demo(vue+vue-router项目)