vue 引入 mint-ui 出错

Question

使用vue-cli构建的项目，之前引入mint-ui的css文件是正常的。

使用babel-plugin-component插件后却报错。错误代码如下

Module not found: Error: Cannot resolve module 'mint-ui/style.css'

我的代码

import MintUI from 'mint-ui'
Vue.use(MintUI)

babelrc也配置过了
{

  "presets": ["es2015", "stage-2"],
  "plugins": ["transform-runtime", ["component", [
    { "libraryName": "mint-ui", "style": true }
  ]]],
  "comments": false
}

Answer 1

你这个不是按需引用的写法，如果babel的配置文件里已经有：

{ "libraryName": "mint-ui", "style": true }

那么不应再用这种全局插件引入的方式：

import MintUI from 'mint-ui'
Vue.use(MintUI)

而是应该在需要使用的时候引入：

import { Button, Toast } from 'mint-ui'
export default {
    components: {
      MtButton: Button
    }
}

Answer 2

解决了吗?我也是同样的问题
使用vue-cli构建的项目，之前引入mint-ui的css文件是正常的。

使用babel-plugin-component插件后却报错。错误代码如下

Answer 3

重新npm install了没

Answer 4

是这样，你是只引用了import MintUI from 'mint-ui'吧，在这之后将mint-ui的css文件在下面在import一次，应该就没有问题了，你试试。

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'

一般是这样来使用的。

Answer 5

需要引入mint的css样式，

import 'mint-ui/lib/style.css'

请参考我的工程：
https://github.com/huangbin1/...

Answer 6

需要引入mint的css样式，import 'mint-ui/lib/style.css' 这个正解！！

Answer 7

Answer 8

@xiaowenxia 但是我每次引入import 'mint-ui/lib/style.css'就报错是怎么回事