title: Webpack 4 error - Module parse failed: Unexpected character '@'
body: <p>I am trying to build a react app and am getting this error from webpack: 'ERROR in ./src/App.css 1:0
  Module parse failed: Unexpected character '@' (1:0)
  You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.'  The first line in App.css where the error occurs is this: <code>@import url('https://fonts.googleapis.com/css?family=Alata|Comfortaa:400,600,700|Roboto&amp;display=swap');
  </code>
  I am using the url-loader I learned about in a thread I read online that was supposed to fix it.</p>
  
  <p>And here is my full web.config.js:</p>
  
  <pre><code>/* eslint-env node */
  
  const webpack = require('webpack');
  // eslint-disable-next-line @typescript-eslint/no-var-requires
  const path = require('path');
  
  module.exports = {
      entry: './src/index.js',
      module: {
          rules: [
              {
                  test: /\.(js|jsx)$/,
                  exclude: [/node_modules/],
                  loader: ['babel-loader', 'eslint-loader']
              },
              {
                  test: /\.(png|woff|woff2|eot|ttf|svg)$/,
                  exclude: /node_modules/,
                  use: [
                      {
                          loader: 'url-loader?limit=100000',
                          options: {
                              name: '[name].[ext]',
                              limit: 1024,
                              publicPath: 'dist/assets/',
                              outputPath: 'dist/assets/'
                          }
                      }
                  ]
              }
          ]
      },
      resolve: {
          extensions: ['*', '.js', '.jsx']
      },
      output: {
          // path: __dirname + '/dist',
          path: path.resolve(__dirname, 'dist'),
          publicPath: '/',
          filename: 'bundle.js'
      },
      plugins: [new webpack.HotModuleReplacementPlugin()],
      devServer: {
          contentBase: './dist',
          hot: true
      }
  };
  </code></pre>