# ys-cli-react

**Repository Path**: yangshundegitee/ys-cli-react

## Basic Information

- **Project Name**: ys-cli-react
- **Description**: 使用ys-webpack-config 和 ys-react-config生成的脚手架，打包工具和前端框架配置分离，方便打包工具的升级和替换
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-01-24
- **Last Updated**: 2022-01-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README


# 可生成以下配置项目
* 支持 [qiankun](https://qiankun.umijs.org/zh/guide/getting-started) 生成主应用和子应用
* 支持 [vite](https://vitejs.cn/guide/) 和 [webpack](https://webpack.docschina.org/guides/) 配置




# 安装
## 一、Install with npm:

```bash
npx ys-cli-react yourProjectName
```

## 二、run with npm
```bash
cd yourProjectName
npm run start:open
```

## 三、启用离线应用Workbox(仅webpack支持)
1.webpack.config.js 添加 useWorkbox配置
```bash
module.exports = {
    useWorkbox: true
}
```

2.入口js文件添加如下代码
```bash
if ('serviceWorker' in navigator) {
  window.addEventListener('load', () => {
    navigator.serviceWorker.register('./service-worker.js').then(registration => {
      console.log('SW registered: ', registration);
    }).catch(registrationError => {
      console.log('SW registration failed: ', registrationError);
    });
  });
}
```


# 四、主应用修改src/index.js （微应用需注意以下配置）
```bash
registerMicroApps([
  {
    name: 'react-webpack2',     // 微应用package.json name字段名保持一致
    entry: '//localhost:8090',  // 端口号和微应用保持一致
    container: '#container',
    activeRule: '/courses',
  }
]);
```