Unable to import/use with Webpack
Closed this issue · 7 comments
Hi, I've been trying to use this amazing icon font variation in a Vue project using Webpack, but nothing worked form me, first it shows a lot of problems with font formats like woff or woff2, after adding support to in the rules it just import like a strange text font (maybe like algerian):
My Webpack test:
{
test: /\.(ttf|woff|woff2|eot|svg|gif|png|jpg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
use: [{
loader: 'file-loader'
}]
}
My import look like this in an scss file:
@import '~line-awesome/dist/line-awesome/css/line-awesome.min.css';
Hello @jonalxh! Did you use NPM package or just sources?
Hi, I use NPM package.
Then you don't need to configure anything. Just import 'line-awesome/dist/line-awesome/css/line-awesome.min.css'
and use icons :)
If you prefer scss, you can import it instead.
Please let me know if you succeed or not
No, it doesn't work, it says cannot load modules or files from css, I think the main problem is with woff2 and woff, but with the webpack config the font crashes.
Hi! Sorry for being late. Can you reproduce the problem on https://codesandbox.io/?
In my index.js I import line-awesome like this:
import 'line-awesome/dist/line-awesome/css/line-awesome.min.css'
Then I execute npm run webpack
(because I need to use it) and it says:
Module parse failed: Unexpected character '' (1:4)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
Due this I did what I wrote in the fist comment and it doesn't allow me to continue.
I'll try to do it in codesandbox o jsfiddle this weekend.
Please, reopen the issue, if you manage to reproduce somewhere :)