Неожиданный символ '@' в @import в конфигурации веб-пакета - PullRequest
0 голосов
/ 11 мая 2018

Итак, сейчас у меня проблема, я настроил свою конфигурацию веб-пакета как таковую

var webpack = require('webpack');
var path = require('path');

var parentDir = path.join(__dirname, '../');

module.exports = {
  entry: [
    path.join(parentDir, 'index.js')
  ],
module: {
   rules: [{
      test: /\.(js|jsx)$/,
      exclude: /node_modules/,
      loader: 'babel-loader'
    }, {
      test: /\.less$/,
      loaders: ["style-loader", "css-loader", "less-loader"]
    }, {
      test: /\.(png|woff|woff2|eot|ttf|svg)$/,
      loader: 'url-loader?limit=100000'
    }]
  },
    output: {
    path: parentDir + '/dist',
    filename: 'bundle.js'
  },
    devServer: {
    contentBase: parentDir,
    historyApiFallback: true
  }
}

Я получаю ошибку

Module parse failed: Unexpected character '@' (11:0)
You may need an appropriate loader to handle this file type.
|  *
|  */
| @import url(https://fonts.googleapis.com/css? 
family=Lato:400,700,400italic,700italic&subset=latin);/*!

Я знаю, что мне нужно добавить правило для этого импорта. Я просто не уверен, какой я новичок в веб-пакете и не могу найти ничего, ссылающегося на этот тип, также этот @import существует в пакете semantic-ui-css

1 Ответ

0 голосов
/ 11 мая 2018

Добавление этого бита в модули в конфигурационном файле, похоже, помогло:

{
  test: /\.css$/,
  use: [
    'to-string-loader',
    'css-loader',
    'resolve-url-loader'
  ]
}
...