错误./node_modules/ts-invariant/process/index.js 24：33-40

Question

我在创建构建时会遇到此错误。

打破变化：

请求“过程/浏览器”无法解决仅因为它是 按照完全指定的解决方案解决（可能是因为起源很严格 eCmascript模块，例如带有JavaScript MimeType的模块，A' .mjs' 文件或' .js'文件，其中包含'type”： “模块”'）。请求中的扩展名是必不可少的 完全指定。将扩展名添加到请求中。解决 “路径”中的“过程/浏览器”

这是我的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',
         })
        ]
    };
};`

Answer 1

我能够通过在字符串中添加.js后缀来解决错误。

---

之前：

new webpack.ProvidePlugin({
    process: 'process/browser',
});

之后：

new webpack.ProvidePlugin({
    process: 'process/browser.js',
})