Element: 引入import 'element-ui/lib/theme-default/index.css'报错

Created on 7 Oct 2016 · 5Comments · Source: ElemeFE/element

引入index.css
index.css:6 Uncaught Error: Cannot find module "./fonts/element-icons.eot?t=1472440741"
我安装说明
import Vue from 'vue'
import Element from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
Vue.use(Element)
但是使用组件，无效

ElementUI version

OS/Browers version

Vue version

Reproduction Link

Steps to reproduce

What is Expected?

What is actually happening?

Source

weiluxia1988

All 5 comments

找不到字体文件造成的。

你需要修改 /node_modules/element-ui/lib/theme-default/index.css，把其中所有的 ?t=1472440741 都删除。

BruceFan-FS71 on 7 Oct 2016

如果你用 webpack 的话请正确配置字体文件的 loader

(webpack2)https://github.com/ElementUI/element-starter/blob/master/webpack.config.js#L30-L31

{
  test: /\.(eot|svg|ttf|woff|woff2)$/,
  loader: 'file'
},

webpack1 的需要匹配到后面的查询参数

test: /\.otf|ttf|woff2?|eot(\?\S*)?$/,

QingWei-Li on 7 Oct 2016

@QingWei-Li
这是正解，我那个是偷巧的方法。

但 Webpack 1.x 的正则应该是 test: /.(eot|svg|ttf|woff|woff2)(\?\S*)?$/ 吧。

这样一是严谨些，二是字体文件里面有 svg 格式的。

BruceFan-FS71 on 7 Oct 2016

👍1

@BruceFan-FS71

module: {
rules: [
{
test: /.vue$/,
loader: 'vue-loader',
options: {
// vue-loader options go here
}
},
{
test: /.js$/,
loader: 'babel-loader',
exclude: /node_modules/
},
{
test: /.css$/,
loader: 'style-loader!css-loader'
},
{
test: /.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
loader: 'file-loader'
},
{
test: /.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]?[hash]'
}
}
]
}