0

我正在尝试将语义-ui-css添加到我的React应用程序中。但是，我收到此错误消息：

“无效或意外的令牌”。

回溯表明解析@import. 任何想法或建议将不胜感激。

另外，我意识到许多其他人也遇到过这个问题，但还没有在 Stack 上找到可行的解决方案。完整源代码可在此处获得：https ://github.com/lgants/django-react-ssr 。

前端/webpack.client.base.config.js

var path = require('path');
var webpack = require('webpack');
var BundleTracker = require('webpack-bundle-tracker');
var CleanWebpackPlugin = require('clean-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
  entry: './src/client/index.js',
  output: {
    filename: '[name]-[hash].js',
    publicPath: '/static/js/',
    path: path.resolve(__dirname, '../backend/app/static/js/')
  },
  // tells webpack to run babel on every file it runs through
  resolve: {
    extensions: ['.js', '.jsx', '.json']
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
        options: {
          presets: [
            'react',
            'stage-0',
            ['env', { targets: { browsers: ['last 2 versions'] } }]
          ]
        }
      },
      {
        test: /\.(png|gif)$/,
        loader: 'url-loader?limit=1024&name=[name]-[hash:8].[ext]!image-webpack-loader'
      },
      {
        test: /\.jpg$/,
        loader: 'file-loader'
      },
      {
       test: /\.css$/,
       use: [
         'style-loader',
         'css-loader'
       ]
      },
      {
        test: /\.(sass|scss)$/,
        loader: ExtractTextPlugin.extract({ use: 'style-loader!css-loader!sass-loader' })
      },
      {
        test: /\.less$/,
        use: [
          'style-loader',
          'css-loader',
          'less-loader'
        ]
      },
      {
        test: /\.(ttf|eot|svg|woff2?)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
        loader: 'file-loader'
      }
    ]
  },
  plugins: [
    new BundleTracker(
      {
        filename: './webpack-stats.client.json'
      }
    ),
    new CleanWebpackPlugin([
      'backend/app/static/js/main-*.*', 'backend/app/static/js/*.hot-update.*'
    ],
      {
        dry: false,
        root: path.resolve(__dirname, '..'),
        watch: true
      }
    )
  ]
};

前端/webpack.client.dev.config.js

var path = require('path');
var merge = require('webpack-merge');
var webpack = require('webpack');
var baseConfig = require('./webpack.client.base.config.js');
var CleanWebpackPlugin = require('clean-webpack-plugin');

const config = {
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
  ]
};

module.exports = merge(baseConfig, config);
4

0 回答 0