Reactjs 网页包5别名解析不正确

Reactjs 网页包5别名解析不正确,reactjs,webpack,Reactjs,Webpack,我刚刚将我的项目从Webpack3更新到了Webpack5,现在我的导入/别名都不起作用了 Webpack位于根目录中 webpack.config.js如下: const webpack = require('webpack'); const path = require('path'); const HtmlWebpackPlugin = require("html-webpack-plugin"); const MiniCssExtractPlugin = requir

我刚刚将我的项目从Webpack3更新到了Webpack5,现在我的导入/别名都不起作用了

Webpack位于根目录中

webpack.config.js如下:

const webpack = require('webpack');
const path = require('path');
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
var mode = process.env.NODE_ENV || 'development';
const config = {

  entry: {
    main: path.resolve(__dirname, 'src/index.js'),
    Dashboard: path.resolve(__dirname, 'src/shared/pages/dashboard/index.js'),
    Driver: path.resolve(__dirname, 'src/shared/pages/driver/index.js'),
    Drivers: path.resolve(__dirname, 'src/shared/pages/drivers/index.js'),
    FAQ: path.resolve(__dirname, 'src/shared/pages/faq/index.js'),
    Home: path.resolve(__dirname, 'src/shared/pages/home/index.js'),
    Job: path.resolve(__dirname, 'src/shared/pages/job/index.js'),
    Jobs: path.resolve(__dirname, 'src/shared/pages/jobs/index.js'),
    Signin: path.resolve(__dirname, 'src/shared/pages/signin/index.js')
  } ,
  // performance: {
  //   hints: "error"
  // },
  output: {
    filename: '[name].[contenthash].js'
  },
  optimization: {
    runtimeChunk: 'single',
    splitChunks: {
      chunks: 'all',
      maxInitialRequests: Infinity,
      minSize: 0,
      cacheGroups: {
        vendor:{
          test: /[\\/]node_modules[\\/]/,
          name(module){
            const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
            return `npm.${packageName.replace('@', '')}`;
          }
        }
      }
    }
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules)/,
        use: {
          loader: 'babel-loader',
        }
      },
      {
        test: /\.css$/i,
        use: ['style-loader', 'css-loader'],
      },
      {
        test: /\.s(a|c)ss$/,
        use: [ 'style-loader', 'css-loader','sass-loader'],
      },
      {
          test: /\.(jpe?g|png|gif|woff|woff2|eot|ttf|svg)(\?[a-z0-9=.]+)?$/,
        use: 'url-loader?limit=100000' 
    }
    ]
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: 'bundle.scss'}
  ),
    new HtmlWebpackPlugin({
      template: path.resolve(__dirname, "src", "index.html")
  })
  ],
  resolve: {
    alias: {
      shared: path.resolve(__dirname, 'src/shared/'),
      client: path.resolve(__dirname, 'src/client/'),
      server: path.resolve(__dirname, 'src/server/'),
      sass: path.resolve(__dirname, 'src/sass/')
    },
    extensions: ['.js', '.sass', '.scss']
  },
  devtool: (mode === 'development') ? 'inline-source-map' : false,
  mode: mode,
  devServer: {
    disableHostCheck: true,
    historyApiFallback: true,
    inline: true,
    contentBase: path.join(__dirname, "dist"),
    publicPath: '/provider/',
    hot: true,
    proxy: {
      '/api/**': {
        target: 'http://localhost:3333/',
        secure: false,
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
};


module.exports = config;
不起作用的导入示例:

import { meFromToken } from 'shared/actions/user'
修复它的更改:

import {meFromToken} from '../../actions/user'

我做错了什么?我不想重构我们所有的导入,因为别名解析不正确。

找到解决方案了吗?没有,最后删除了这个