__dirname 未定义 - WEBPACK [重复]答案

【问题标题】：__dirname is not defined - WEBPACK [duplicate]__dirname 未定义 - WEBPACK [重复]
【发布时间】：2021-07-01 00:57:03
【问题描述】：

我不得不切换到导入并从 browserify 切换到 webpack。这是我在 CLIENTSIDE 上的 Webpack 配置。如果我做 module.exports 它会说模块未定义...自然我只是将其切换为导出默认值。

我的 package.json 中有 type: "module"。

对这里的解决方案有什么想法吗？我认为 dirname 来自节点“路径”模块。我实际上不知道如何在浏览器之外的客户端获取绝对目录值......你不能使用“”或“./”或“/”。不允许使用相对路径。

谢谢！

未捕获的引用错误：__dirname 未定义

// webpack.config.js
export default {
  mode: "development",
  entry: ["./src/index.js", "./src/index.css"],
  output: {
    path: __dirname,
    publicPath: "/",
    filename: "./dist/bundle.js",
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "script-loader",
        },
      },
      {
        test: /\.css$/,
        use: [
          {
            loader: "style-loader",
          },
          {
            loader: "css-loader",
            options: {
              modules: true,
              importLoaders: 1,
              sourceMap: true,
            },
          },
        ],
      },
    ],
  },
};

【问题讨论】：

记得在帖子中显示实际错误。

标签： javascript webpack es6-modules

【解决方案1】：

在您的代码中间接尝试这种方式，而不是从您的 package.json 中。让我知道这是否有效。

import path from 'path';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

【讨论】：