Vue UI组件库(Day58)

188 阅读1分钟

Vue UI组件库

移动端

  1. Vant vant-contrib.gitee.io/vant/#/zh-C…

  2. Cube UI didi.github.io/cube-ui/#/z…

  3. Mint UI mint-ui.github.io/#!/zh-cn

PC端

  1. Element UI element.eleme.cn/#/zh-CN

  2. Iview UI www.iviewui.com/

按需引入element UI

  1. 安装babel-plugin-component

    npm install babel-plugin-component -D
    
  2. 设置babel.config.js文件

    module.exports = {
      presets: [
        '@vue/cli-plugin-babel/preset',
        ["es2015", { "modules": false }]
      ],
      "plugins": [
        [
          "component",
          {
            "libraryName": "element-ui",
            "styleLibraryName": "theme-chalk"
          }
        ]
      ]
    }
    
  3. 依据报错信息进行相应操作

    1. Error: Cannot find module 'babel-preset-es2015'

      npm i babel-preset-es2015
      
    2. Error: Plugin/Preset files are not allowed to export objects, only functions. In

      module.exports = {
        presets: [
          '@vue/cli-plugin-babel/preset',
          ["@babel/preset-env", { "modules": false }]
        ],
        "plugins": [
          [
            "component",
            {
              "libraryName": "element-ui",
              "styleLibraryName": "theme-chalk"
            }
          ]
        ]
      }
      

注: 报错信息与开发者电脑配置与项目配置相关,只能遇到问题解决问题