这是比较常见的一种部署方式,比如开发时是前后端分离的,部署的时候,由服务端提供一个容器,存放我们编译之后的静态页面。
    执行 umi 的编译脚本

    1. $ npm run build
    2. > @ build /Users/xiaohuoni/Documents/GitHub/umi-course/hero
    3. > umi build
    4. [09:48:33] webpack compiled in 12s 48ms
    5. DONE Compiled successfully in 12057ms 09:48:33
    6. File sizes after gzip:
    7. 320.5 KB dist/umi.js
    8. 15.31 KB dist/umi.css

    将生成 dist 目录下面的文件拷贝到服务端提供的容器即可。
    注意部署的时候,要将所有的请求指向正确的服务。mock 服务不可用。

    这里常常会遇到一个问题。
    部署完之后,页面没有报错,但是确是空白页。
    这时候就可以考虑可能是遇到了非根目录部署的问题了

    可通过配置 base 解决。

    1. export default {
    2. base: '/path/to/your/app/root',
    3. };

    比如服务端给你的访问链接是 https://www.xxx.com/web

    那这里你就可以尝试配置

    1. export default {
    2. base: '/web',
    3. };