CODEWITHSUNDEEP
vue.jsiview
aircraft
aircraft

Reputation: 26896

Module parse failed: Unexpected character '�' (1:0)

When I follow the iview document:

import 'iview/dist/styles/iview.css'

in my main.js.

There I get the bellow output error:

client?7705:167 ./node_modules/iview/dist/styles/fonts/ionicons.eot?v=2.0.0
Module parse failed: Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
 @ ./node_modules/css-loader!./node_modules/iview/dist/styles/iview.css 7:4430-4469 7:4495-4534
 @ ./node_modules/iview/dist/styles/iview.css
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://0.0.0.0:8081 webpack/hot/dev-server ./src/main.js

In my webpack.config.js:

  module: {
    loaders: [
          // the url-loader uses DataUrls.
          // the file-loader emits files.
          { test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" },
          { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" },
          { test: /\.json$/, loader: "json" },
          {test: /\.less$/, loader: "style!css!less"},
          {test: /\.(woff|woff2)(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=application/font-woff'},
          {test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: 'file'},
          {test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: 'url?limit=10000&mimetype=image/svg+xml'}
        ]
      },
    ...

I don't know what else should be config in my loader. If I do not import the iview.css:

 //import 'iview/dist/styles/iview.css'

there do not have this issue.

Upvotes: 3

Views: 5722

Answers (2)

techkuz
techkuz

Reputation: 3956

Try this:

test: /\.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,

Or put an absolute path to your problem modules.

Upvotes: 1

Bhojendra Rauniyar
Bhojendra Rauniyar

Reputation: 85545

Try using url loader like this:

{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' }

For more general use case, by adding suffix :

{
  test: /\.(jpe?g|png|woff|woff2|eot|ttf|svg)(\?[a-z0-9=.]+)?$/, 
  loader: 'url-loader?limit=100000'
}

source

Upvotes: 0

Related Questions