.umirc.ts 基本配置

3 篇文章 0 订阅

umirc.ts 基本配置大全

import { defineConfig } from "umi";
 
export default defineConfig({
  nodeModulesTransform: {
    type: 'none',
  },
  // 热更新
  fastRefresh:{
  },
  // 标签页标题
  title:'测试项目',
  // 自定义加载页,默认为loading...
  dynamicImport:{
    loading:'@/pages/Loading',
  },
  // 标签页图标
  links: [{ rel: 'icon', href: '/favicon.ico' }],
  // 加快编译速度
  mfsu:{},
  //开启按需加载
  dynamicImport: {
  },
  //开启按需加载后把 css 打包成一个文件
  chainWebpack(config) {
    config.optimization.splitChunks({
      cacheGroups: {
        styles: {
          name: 'styles',
          test: /\.(css|scss)$/,
          chunks: 'async',
          minChunks: 1,
          minSize: 0,
        }
      },
    });
  },
  //配置 externals 还能减小编译消耗
  externals: {
    'react': 'window.React',
    'react-dom': 'window.ReactDOM',
    'moment': 'window.moment',
    'antd': 'window.antd',
  },
  scripts: [
    'https://cdn.bootcdn.net/ajax/libs/react/17.0.1/umd/react.development.min.js',
    'https://cdn.bootcdn.net/ajax/libs/react-dom/17.0.1/umd/react-dom.production.min.js',
    'https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.min.js',
    'https://cdnjs.cloudflare.com/ajax/libs/antd/4.8.2/antd.min.js',
  ],
  //样式生效必须写在styles里面
  styles: [ 'https://cdnjs.cloudflare.com/ajax/libs/antd/4.8.2/antd.min.css'],
  dva: {
  },
  antd: false,//启用后自动配置 babel-plugin-import实现antd按需加载  false 表示不开启  {} 表示开启
  antdMobile:false, // antd-mobile同理
  //sass配置
  sass: {
  },
  request: {
    dataField: 'data',
  },
  // 路由配置
  routes: [
    { path: '/', component: '@/pages/Login/index' },
    { path: '/login', component: '@/pages/Login/index' },
    { path: '/home', component: '@/pages/Home', routes: [
      // { path: '/home', redirect: '/home/index' },  // 路由重定向,需要写在子路由中
      {
        path: '/home/index', component: '@/pages/index', name: 'string'
      },
      {
        path: '/home/hot', component: '@/pages/Hot', name: '热门'
      },
      { path: '/*', component: '@/pages/NotFound' }, },
  ],
  targets: { //配置浏览器最低版本,比如兼容ie11
    ie: 11
  },
  hash: true,  //开启打包文件的hash值后缀,
  proxy: {
    '/api': {
      'target': 'http://192.168.3.12:8028/',
      'changeOrigin': true,
      'pathRewrite': { '^/api' : '' },
    },
  },

});
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
vite.config.ts是Vite项目的配置文件,用于配置的构建、开发和部署等参数。下面是vite.config.ts的一些常用配置项的详解: 1. `root`:指定项目根目录,默认为当前工作目录。 :指定项目在上的基础路径,默认为`/`。如果你的项目署在子路径下,可以通过设置该项来指定。 3. `publicDir`:指静态资源存放的目录,默认为public`。在该目录下的文件被复制到建输出目录。 4. `build`:用于配置构建相关的参数。 - `outDir`:指定构建输出目录,默认为`dist`。 - `assetsDir`:指定构建输出的静态资源目录,默认为`assets`。 - `sourcemap`:是否生成源映射文件,默认为`false`。 - `minify`:是否压缩构建输出,默认为`true`。 - `terserOptions`:用于配置Terser压缩器的选项。 - `cssCodeSplit`:是否将CSS代码拆分成单独的文件,默认为`true`。 - `rollupOptions`:用于配置Rollup打包器的选项。 5. `server`:用于配置开发服务器相关的参数。 - `host`:指定服务器主机名,默认为`localhost`。 - `port`:指定服务器端口号,默认为`3000`。 - `https`:是否启用HTTPS,默认为`false`。 - `proxy`:用于配置代理服务器的选项。 6. `plugins`:用于配置Vite插件。可以通过该选项来扩展Vite的功能。 7. `resolve`:用于配置模块解析相关的参数。 - `alias`:用于配置模块别名,可以简化模块引入的路径。 - `extensions`:指定模块的扩展名,默认为`['.js', '.jsx', '.ts', '.tsx', '.json']`。 8. `css`:用于配置CSS相关的参数。 - `preprocessorOptions`:用于配置CSS预处理器的选项。 以上是vite.config.ts的一些常用配置项的详解,你可以根据项目需求进行相应的配置

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

范德萨_

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值