1.umi创建工程 https://umijs.org/zh-CN/docs/getting-started;止于启动项目yarn start;不添加layout:{}
2.添加antd,react-unity-webgl (均为最新版本);package.json
{
"private": true,
"scripts": {
"start": "umi dev",
"build": "umi build",
"postinstall": "umi generate tmp",
"prettier": "prettier --write '**/*.{js,jsx,tsx,ts,less,md,json}'",
"test": "umi-test",
"test:coverage": "umi-test --coverage"
},
"gitHooks": {
"pre-commit": "lint-staged"
},
"lint-staged": {
"*.{js,jsx,less,md,json}": [
"prettier --write"
],
"*.ts?(x)": [
"prettier --parser=typescript --write"
]
},
"dependencies": {
"@ant-design/pro-layout": "^6.5.0",
"@umijs/preset-react": "1.x",
"antd": "4.13.0",
"react-unity-webgl": "^8.1.1",
"umi": "^3.3.9"
},
"devDependencies": {
"@types/react": "^17.0.0",
"@types/react-dom": "^17.0.0",
"@umijs/test": "^3.3.9",
"lint-staged": "^10.0.7",
"prettier": "^2.2.0",
"react": "17.x",
"react-dom": "17.x",
"typescript": "^4.1.2",
"yorkie": "^2.0.0"
}
}
3.创建public文件夹,拷贝unity webgl build输出包(只保留build内文件);修改index.tsx
import styles from './index.less';
import {Button} from 'antd/es';
import Unity,{UnityContext} from 'react-unity-webgl';
const unityContext = new UnityContext({
loaderUrl: "build/build.loader.js",
dataUrl: "build/build.data",
frameworkUrl: "build/build.framework.js",
codeUrl: "build/build.wasm",
});
export default function IndexPage() {
return (
<div>
<h1 className={styles.title}>Page index</h1>
<Button>Hit me</Button>
<Unity width="100%" height="100%" unityContext={unityContext} />
</div>
);
}
4. yarn start 正常运行;暂时比较顺利;(dva基本不跟新,使用dva引入antd,编译失败无法运行<_<)!