• 按需引入antd报错问题


    1.使用create-react-app工具创建了一个项目

    create-react-app antd-demo
    

    2.安装babel-plugin-import

    npm install babel-plugin-import --dev

    3.按需引用antd

    在App.js里面引入,

    import { Button } from 'antd';
    

    package.json里面配置babel

     "babel": {
        "plugins": [
          [
            "import",
            {
              "libraryName": "antd",
              "style": true
            }
          ]
        ]
      },
    

      最后项目启动报错,报错信息如下

    ./node_modules/antd/lib/button/style/index.less
    Module build failed: 
    
    // https://github.com/ant-design/ant-motion/issues/44
    .bezierEasingMixin();
    ^
    Inline JavaScript is not enabled. Is it set in your options?
          in E:webstrommigu
    gocweb
    eact-interface
    eact-interface-cli
    ode_modulesantdlibstylecolorezierEasing.less (line 110, column 0)
    

      最后把"style":“css”就可以了

    这里的style可以为true或者‘css’,但是不知道为什么使用true就报错,

    babel-plugin-import配置,options可以为数组

    {  
      "plugins":[["import",options]]  
    } 

    导入js模块:

    ["import", { "libraryName": "antd" }]  

     导入js和css模块(LESS/Sass源文件):

    ["import", { "libraryName": "antd", "style": true }] 
    

      导入js和css模块(css 内置文件):

    ["import", { "libraryName": "antd", "style": "css" }]  
    

      

  • 相关阅读:
    CAST()类型转换函数
    CLR LOH的危险
    保持积极的态度,态度决定一切!
    as 操作符和强行转换的区别
    查内存覆盖从以前的帖子里总结的
    CLR中的范型为什么不支持很多操作符?
    如何做一个好的Team Leader?
    Dispose Pattern总结
    慎用Reflection
    CLR Enum类型内幕
  • 原文地址:https://www.cnblogs.com/heihei-haha/p/9041093.html
Copyright © 2020-2023  润新知