vue引用elementUI,报indx.css找不到的错?

vue引用elementUI,在node_modules中可以找到elementui的文件
在webpack.base.conf.js中
{

    test: /\.css$/,
    loader: 'style!css'
  },
  {
    test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
    loader: 'file',
    query: {
      limit: 10000,
      name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
    }
  }
  
  

在main.js中输入
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
Vue.use(ElementUI)

但是就是输出
clipboard.png

阅读 9.3k
4 个回答

问题已解决 步骤为:
1.cnpm install style-loader -D
2.cnpm install css-loader -D
3.cnpm install file-loader –D
4.安装cnpm install element-ui -S
5.在main.js中引入:

import ElementUI from ‘element-ui‘
import ‘element-ui/lib/theme-default/index.css‘
Vue.use(ElementUI)

试试这样引入import '../node_modules/element-ui/lib/theme-default/index.css';

用vue-cli吧,把精力放在业务逻辑上,配环境什么的,唉~

1、npm install --save-dev style-loader css-loader file-loader
2、webpack.config.js:

      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      },
      {
        test: /\.css$/,
        loader: 'style-loader!css-loader'
      },      
      {
        test: /\.(eot|svg|ttf|woff|woff2)$/,
        loader: 'file-loader'
      },            
      {
        test: /\.(png|jpg|gif|svg)$/,
        loader: 'file-loader',
        options: {
          name: '[name].[ext]?[hash]'
        }
      }    
注意:style-loader!css-loader等不要简写成style!css,并且style-loader要放在css-loader前边,报错很可能就因为这个

3、main.js中正常引入:

import ElementUI from "element-ui"
import "element-ui/lib/theme-default/index.css"
Vue.use(ElementUI)

4、npm run dev

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题