# testWebpack

**Repository Path**: windRainCode/test-webpack

## Basic Information

- **Project Name**: testWebpack
- **Description**: webpack测试项目
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-02-19
- **Last Updated**: 2024-06-14

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 说明

这个是一个测试webpack测试项目，主要用于webpack操作。

[webpack文档](https://www.webpackjs.com/concepts/)
[插件文档](https://www.webpackjs.com/plugins/html-webpack-plugin/)

[webpack 如何编写 loader](https://blog.csdn.net/qq_41887214/article/details/128605233)



## 设计

> 基于webpack，升级web-tools项目



### A-设计背景

> 项目内容主要是一些，自己玩玩或者开发过程中实验的小功能。

目前整个web-tools项目，出于可用状态，基本上可以满足业务需要。

但是，目前这个项目很多地方都非常原始。

1. 没有成为一个完整的node项目，目前虽同属于一个node项目下，但只用了upload这一个功能（上传到oss）。
2. 项目的每一个小块在业务开发的过程中，都不同程度地依赖了某些第三方库，随着项目越来越多，每次上传到oss的这种无意义的库也越来越多。
3. 因为没有脚手架的支持，页面中的模块拆分，比较奇怪（jsx还好，但是vue项目就不是那么方便了）



### B-诉求

1. - [ ] 各个文件（html）依然独立，webpack自动寻找 `src` 目录下的  `pageConfig.json`、`*.html`、`index.js`、 `index.jsx`、`index.ts`、`index.tsx`。

     > 1. 如果有`pageConfig.json`，优先处理 `pageConfig.json`，按照其中配置项配置页面。
     >
     > 2. 在目录中查找是否 `index.js`、 `index.jsx`、`index.ts`、`index.tsx` 如果有，则按注册为 `entry` 对象
     >
     > 3. 在目录中查找 `*.html` , 如果有则（照当前目录地址）生成到dist中。

     - [x] 第一阶段：只处理 `index.js` 、`*.html` 
     - [ ] 第二阶段：处理 `index.jsx` 、`index.ts`、`index.tsx`
     - [ ] 第三阶段：处理 `pageConfig.json`
     - [ ] 第四阶段：处理 `*.vue`

2. - [ ] 抽离依赖，将通用的第三方库，统一维护到 package.json 中，并使用CND。
     - [ ] 第一阶段：抽离第三方库
     - [ ] 第二阶段：webpack打包时不打包第三方库，依赖从CDN中获取。

3. - [ ] 重写，oss上传库`ali-oss-deploy-plus`。

     - [ ] 移除无用打印内容
     - [ ] MD5比较文件，节约流量
     - [ ] 上传前，统一删除`oss`中老文件