Reactjs 网页包5别名解析不正确
我刚刚将我的项目从Webpack3更新到了Webpack5,现在我的导入/别名都不起作用了 Webpack位于根目录中 webpack.config.js如下: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
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'
我做错了什么?我不想重构我们所有的导入,因为别名解析不正确。找到解决方案了吗?没有,最后删除了这个