UmiJS .umirc.ts或者config/config.ts文件 中 常用的開發配置

 

import { defineConfig } from 'umi';

export default defineConfig({
  nodeModulesTransform: {
    type: 'none',
  },
  hash:true,// 配置是否讓生成的文件包含 hash 哈希后綴，通常用於增量發布和避免瀏覽器加載緩存
  // base:'/admin/', // 設置路由前綴，通常用於部署到非根目錄

  // (修改后重新執行打包命令)可以嘗試將 publicPath 設置成 ./ 相對路徑 
  // 也可以使用 CDN 部署，把 publicPath 的值設為 CDN 的前綴域名和地址值就可以(打包后的靜態文件前綴就會加上這個cdn 連接地址)
  publicPath:'https://www.baidu.com/cdn/',
  outputPath:'bulid', // 修改打包后的文件命名.（注意：不允許設定為 src、public、pages、mock、config 等約定目錄）
  title:'umijs',// 配置標題 這里是全局的默認頁面標題，（也可以在路由配置中在設置單獨對應的頁面標題title屬性）
  history:{ // 路由模式配置
    // type:'hash' // 路由url前面 帶#號 （瀏覽器兼容好）
    type:'browser' // 路由url前面 不帶#號 同時不配置也是默認選項（個別瀏覽器不兼容）
  },
  targets:{ // 配置需要兼容的瀏覽器最低版本，會自動引入 polyfill 和做語法轉換
    ie:11 // 配置兼容 ie到11版本
  },
  // 請求反向代理配置
  proxy: {
    '/api': { // 匹配：接口前綴是/api的接口 走這個請求代理
      'target': 'http://jsonplaceholder.typicode.com/',// 代理服務器轉發到 服務器接口地址
      'changeOrigin': true,
      'pathRewrite': { '^/api' : '' }, // 最后把/api 替換成空 '' 列如：/api/students 轉化：http://jsonplaceholder.typicode.com/students 發送到服務器
    },
  },
  // 配置 主題 ：修改 Less 變量
  // 因為umijs 集成了ant.design ui框架 使用到了Less 預編譯 這里可以進行修改整體風格主題或者對應的Less變量值
  // 參考：https://ant.design/docs/react/customize-theme-cn
  theme:{
    '@primary-color':'#1890ff'
  },
  // 路由配置
  routes: [
    { path: '/', component: '@/pages/index', title:'首頁' },
    { path: '/list', redirect:'/user/one' }, // 路由訪問 /list的時候 會重定向到 下面對應的 /user/two頁面去
    {
      path:'/user',
      component:'@/layouts/index', // 使用到了模板 下面兩個頁面都會繼承這個模板的內容
      wrappers: [
        '@/wrappers/auth',
      ],
      routes:[
        { path: '/user/one/:id?', component: '@/pages/index' },
        { path: '/user/two', component: '@/pages/user' },
        {component: '@/pages/404' }
      ]
    },
    {component: '@/pages/404' }
  ],
  // 開啟 視圖快速更新 只要寫了這個屬性對象就是開啟的
  fastRefresh: {},
  mock:false, // mock是本地模擬接口的數據的一種快捷測試方式，默認是開啟的，當要使用后端提供的接口和數據的時候可以關閉 
});

 

正常本地打包部署線上解決頁面白板：

base:'./',

publicPath:"./"

在上面的配置中修改對應的屬性

 

我是馬丁的車夫，歡迎轉發收藏！