vue element-UI 升级报错Cannot find module "element-ui/lib/theme-default/index.css"

饿了么 用之前的版本 有些组件跟api 不一样了所以更新了最新的版本,发现 报一堆错误 主要错误是这个

Cannot find module "element-ui/lib/theme-default/index.css"

  到文件下查找这个文件发现新版本中 这个文件已经移除,文件改名为theme-chalk

这样就需要用现在有的文件名替换之前的文件名就可以了 。

修改完以上引入发现还是报这个错。后来仔细看了 下原来 .babelrc 配置文件下引入的默认的 还是之前的文件名

 

"plugins": [
    "transform-runtime",
    ["component", [
      {
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]]
  ],

 

  

 

以上是正确的配置文件,修改之后升级完成。项目正常运行 

转载于:https://www.cnblogs.com/wupeng88/p/8872644.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
根据提供的引用内容,可以得知在Vue2.0中引用element-ui组件库需要引入样式文件,并且如果出现报错可以在webpack.config.js中配置file_loader。如果仍然出现问题,可以在项目根目录下的build->webpack.dev.conf.js中将usePostCSS改为false即可。 关于Vueelement-ui/lib/theme-chalk/index.css和webpack的介绍和演示如下: Vue是一套用于构建用户界面的渐进式框架,它的核心库只关注视图层,易于上手,同时也便于与第三方库或既有项目整合。Vue也提供了一套完整的工具链,包括构建工具、脚手架、路由、状态管理等,可以帮助开发者更好地构建大型单页应用。 element-ui是一套基于Vue2.0的组件库,它提供了丰富的UI组件,包括表单、弹窗、导航、布局等,可以帮助开发者快速构建美观、易用的Web应用。 webpack是一个现代化的JavaScript应用程序静态模块打包器,它可以将多个模块打包成一个文件,以便在浏览器中使用。webpack支持各种各样的模块类型,包括CommonJS、AMD、ES6等,还可以通过loader和plugin扩展其功能。 演示如下: 1.在Vue项目中引入element-ui组件库 ```javascript // 引入element-ui样式文件 import 'element-ui/lib/theme-chalk/index.css'; // 引入element-ui组件库 import ElementUI from 'element-ui'; // 使用element-ui组件库 Vue.use(ElementUI); ``` 2.在webpack.config.js中配置file_loader ```javascript module.exports = { module: { rules: [ { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'file-loader', options: { name: utils.assetsPath('img/[name].[hash:7].[ext]') } } ] } } ``` 3.在build->webpack.dev.conf.js中将usePostCSS改为false ```javascript module.exports = merge(baseWebpackConfig, { module: { rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: false }) } }) ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值