美文网首页
解决vue项目使用element-ui时,样式不生效的问题

解决vue项目使用element-ui时,样式不生效的问题

作者: CoderZb | 来源:发表于2020-01-06 01:31 被阅读0次

    项目中我准备使用element-ui做跑马灯效果,仅仅执行sudo cnpm install babelcnpm install element-ui -save,配置了相关代码之后 发现有些类选择器(el-carousel 、el-carousel--horizontal等等)没加载上去。
    最终得知道仅仅安装element-ui是不够的,还必须得安装babel-plugin-component
    解决办法如下,以下三个步骤必不可少。

    步骤一:执行如下命令,安装babel-plugin-component

    sudo cnpm install babel-plugin-component  --save
    

    步骤二:在vue项目的.babelrc文件中增加如下JSON

    "plugins": [
        [
        "component",
        {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
        }
        ]
      ]
    
    image.png

    步骤三:如果仅做如上两步骤会报错,具体参考我的这篇文章

    解决vue使用element-ui时,报xxx/element-ui/lib/theme-chalk/fonts/element-icons.ttf的问题

    相关文章

      网友评论

          本文标题:解决vue项目使用element-ui时,样式不生效的问题

          本文链接:https://www.haomeiwen.com/subject/jerhactx.html