.umirc.ts

YoungSir_發表於2020-12-11
/*
 * @Description: umi3.0基礎配置檔案 檔案多時候移到config檔案下面單獨配置模組 如 路由檔案 .umirc.ts配置檔案
 * @Version: 2.0
 * @Autor: lhl
 * @Date: 2020-03-20 14:15:48
 * @LastEditors: lhl
 * @LastEditTime: 2020-05-27 13:41:14
 */
import { defineConfig, utils } from 'umi';
import { resolve } from "path";
import pageRoutes from './config/router.config'

const { winPath } = utils;

// umi所有配置是平拍方式配置的 推薦在 .umirc.ts 中寫配置。如果配置比較複雜需要拆分,可以放到 config/config.ts 中,並把配置的一部分拆出去,比如路由。兩者二選一,.umirc.ts 優先順序更高
export default defineConfig({
  // 配置標題
  // title: 'hi-umi你好',
  // ant-design-pro 的佈局
  // layout: {
  //   name: 'Ant Design',
  //   locale: true
  // },
  base: '/',
  //生成hash檔名
  hash: true,
  //hash路由
  history: {
    type: 'hash',
  },
  // 為所有非三方指令碼加上 crossorigin="anonymous" 屬性,通常用於統計指令碼錯誤。
  crossorigin: true,
  analytics: {
    ga: 'google analytics code', // 百度統計程式碼
    baidu: '5a66cxxxxxxxxxx9e13', // Google 統計程式碼
  },
  // disableRedirectHoist: true,//禁用 redirect 上提。
  devtool: 'source-map',//生成map檔案
  //相容瀏覽器版本  配置需要相容的瀏覽器最低版本,會自動引入 polyfill 和做語法轉換 Default: { chrome: 49, firefox: 64, safari: 10, edge: 13, ios: 10 }
  targets: {
    ie: 11,
  },
  // 使用 antd
  antd: {
    dark: false,
  },
  // 暫時關閉
  pwa: false,
  // locale: {
  //   default: 'zh-CN',
  //   baseNavigator: true,
  // },

  // 使用過 dva 目前內建版本是 ^4.0.0
  // 內建 dva,預設版本是 ^2.6.0-beta.20,如果專案中有依賴,會優先使用專案中依賴的版本。
  // 約定是到 model 組織方式,不用手動註冊 model
  // 檔名即 namespace,model 內如果沒有宣告 namespace,會以檔名作為 namespace
  // 內建 dva-loading,直接 connect loading 欄位使用即可
  dva: {
    immer: true, // 表示是否啟用 immer 以方便修改 reducer
    hmr: true, // 表示是否啟用 dva model 的熱更新
  },
   // 配置主題,實際上是配 less 變數
   theme: {
    '@primary-color': '#1DA57A',
  },
  // 代理配置(跨域處理) http://10.98.98.142:8080/
  proxy: {
    '/api': {
      'target': 'http://10.98.101.225:8089/goods',
      'changeOrigin': true,
      'pathRewrite': { '^/api' : '' },
    },
  },
  // 額外樣式配置
  styles: [
    `h1 { color: red !important; }`,
    // `https://a.com/b.css`,
  ],
  // 別名配置
  alias: {
    "@": resolve(__dirname, "./src"),
  },
  // 路由配置
  routes: pageRoutes,
  // 是否啟用按需載入,即是否把構建產物進行拆分,在需要的時候下載額外的 JS 再執行
  dynamicImport: {
    // 無需 level, webpackChunkName 引入 tsx時候看看 tsconfig.json配置了相關配置沒
    loading: '@/components/PageLoading/index',
  },
  cssLoader: {
    // 這裡的 modules 可以接受 getLocalIdent
    modules: {
      getLocalIdent:(
        context: {
          resourcePath: string;
        },
        _: string,
        localName: string,
      ) => {
        if (
          context.resourcePath.includes('node_modules') ||
          context.resourcePath.includes('ant.design.pro.less') ||
          context.resourcePath.includes('global.less')
        ) {
          return localName;
        }
        const match = context.resourcePath.match(/src(.*)/);
        if (match && match[1]) {
          const antdProPath = match[1].replace('.less', '');
          const arr = winPath(antdProPath)
            .split('/')
            .map((a: string) => a.replace(/([A-Z])/g, '-$1'))
            .map((a: string) => a.toLowerCase());
          return `antd-pro${arr.join('-')}-${localName}`.replace(/--/g, '-');
        }
        return localName;
      },
    }
  }
});