umi3 使用antd-mobile的时间选择器DatePicker 报错

xinbear
  • 333

我在页面中加入了DatePicker组件 页面直接报错

Module "./antd-mobile/es/date-picker/style" does not exist in container.
while loading "./antd-mobile/es/date-picker/style" from webpack/container/reference/mf
Error: Module "./antd-mobile/es/date-picker/style" does not exist in container.
while loading "./antd-mobile/es/date-picker/style" from webpack/container/reference/mf
    at http://localhost:8000/mf-va_remoteEntry.js:399:11

image.png
image.png

我的配置文件:

import { defineConfig } from 'umi';
import routes from './routes';

export default defineConfig({
  nodeModulesTransform: {
    type: 'none',
  },
  extraPostCSSPlugins: [
    // require('postcss-flexbugs-fixes'),
    require('postcss-px-to-viewport')({
        viewportWidth: 375, // 视窗的宽度,对应的是我们设计稿的宽度,一般是375
        unitPrecision: 3, // 指定`px`转换为视窗单位值的小数位数(很多时候无法整除)
        viewportUnit: 'vw', // 指定需要转换成的视窗单位,建议使用vw
        selectorBlackList: [], // 指定不转换为视窗单位的类,可以自定义,可以无限添加,建议定义一至两个通用的类名
        minPixelValue: 1, // 小于或等于`1px`不转换为视窗单位,你也可以设置为你想要的值
        mediaQuery: false, // 允许在媒体查询中转换`px`
    }),
  ],
  // layout: {},
  mfsu: {},
  routes,
  fastRefresh: {}
});

组件代码:


import { Component } from 'react';
import { DatePicker } from 'antd-mobile';

class IndexPage extends Component {


  constructor(props: any){
    super(props);

  }


  render() {

      return (
        <div>
            <div>1</div>
            {/* 去除DatePicker 便可以正常运行 */}
            <DatePicker>
            </DatePicker>
        </div>
      )
  }
}

export default IndexPage;

umi版本:

"dependencies": {
    "@ant-design/pro-layout": "^6.5.0",
    "normalize.css": "^8.0.1",
    "react": "17.x",
    "react-dom": "17.x",
    "umi": "^3.5.13"
  },
  "devDependencies": {
    "@types/react": "^17.0.0",
    "@types/react-dom": "^17.0.0",
    "@umijs/preset-react": "1.x",
    "@umijs/test": "^3.5.13",
    "lint-staged": "^10.0.7",
    "postcss-px-to-viewport": "^1.1.1",
    "prettier": "^2.2.0",
    "typescript": "^4.1.2",
    "yorkie": "^2.0.0"
  }
回复
阅读 1.4k
1 个回答
✓ 已被采纳

经检测其他的antd-mobile组件也会报错

解决方法是 删掉 src/.umi目录 重新运行下就好了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏