[英]ERROR ./node_modules/ts-invariant/process/index.js 24:33-40
I am getting this error while creating a build.创建构建时出现此错误。
BREAKING CHANGE:重大变化:
The request 'process/browser' failed to resolve only because it was resolved as fully specified (probably because the origin is strict EcmaScript Module, eg a module with javascript mimetype, a ' .mjs' file, or a ' .js' file where the package.json contains '"type": "module"').
请求 'process/browser' 解析失败只是因为它被解析为完全指定(可能是因为来源是严格的 EcmaScript 模块,例如具有 javascript mimetype 的模块、'. mjs' 文件或其中的 ' .js' 文件package.json 包含“类型”:“模块”)。 The extension in the request is mandatory for it to be fully specified.
请求中的扩展名是强制性的,以便完全指定。 Add the extension to the request.
将扩展名添加到请求中。 resolve 'process/browser' in 'Path'
在“路径”中解析“进程/浏览器”
Here is my webpack.config file这是我的 webpack.config 文件
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyPlugin = require('copy-webpack-plugin');
const { outputConfig, copyPluginPatterns, entryConfig, devServer } = require("./env.config");
const webpack = require('webpack');
require('dotenv').config({ path: './.env' });
module.exports = (env, options) =>
{
return {
mode: options.mode,
entry: entryConfig,
devServer,
target: "web",
module: {
rules: [
{
test: /\.tsx?$/,
use: "ts-loader",
exclude: /node_modules/,
},
{
test: /\.(graphql|gql)$/,
exclude: /node_modules/,
loader: 'graphql-tag/loader',
},
{
test: /\.(css|scss)$/,
use: [
// We're in dev and want HMR, SCSS is handled in JS
// In production, we want our css as files
"style-loader",
"css-loader",
{
loader: "postcss-loader",
options: {
postcssOptions: {
plugins: [
["postcss-preset-env"],
],
},
},
},
"sass-loader"
],
},
{
test: /\.(?:ico|gif|png|jpg|jpeg|svg)$/i,
type: "javascript/auto",
loader: "file-loader",
options: {
publicPath: "../",
name: "[path][name].[ext]",
context: path.resolve(__dirname, "src/assets"),
emitFile: false,
},
},
{
test: /\.(woff(2)?|eot|ttf|otf|svg|)$/,
type: "javascript/auto",
exclude: /images/,
loader: "file-loader",
options: {
publicPath: "../",
context: path.resolve(__dirname, "src/assets"),
name: "[path][name].[ext]",
emitFile: false,
},
},
],
},
resolve: { extensions: [".tsx", ".ts", ".js",".jsx",".json"],fallback: {
path: false,
buffer: false,
crypto: false
},alias: {
process: "process/browser"
}
},
output: {
filename: "js/[name].bundle.js",
path: path.resolve(__dirname, outputConfig.destPath),
publicPath: "",
},
plugins: [
new HtmlWebpackPlugin({
template: "./src/index.html",
inject: true,
minify: false
}),
new webpack.DefinePlugin({
"process.env": JSON.stringify(process.env)
}),
new CopyPlugin(copyPluginPatterns),
new webpack.ProvidePlugin({
process: 'process/browser',
})
]
};
};`
I was able to solve the error by adding the .js
suffix to the string.我能够通过向字符串添加
.js
后缀来解决错误。
Before:前:
new webpack.ProvidePlugin({
process: 'process/browser',
});
After:后:
new webpack.ProvidePlugin({
process: 'process/browser.js',
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.