1

I am trying a simple webpack configuration from a tutorial. My web pack config file looks like this:

import path from "path";

export default {
  debug: true,
  devtool: "inline-source-map",
  noInfo: false,
  entry: [path.resolve(__dirname, "src/index")],
  target: "web",
  output: {
    path: path.resolve(__dirname, "src"),
    publicPath: "/",
    filename: "bundle.js",
  },
  plugins: [],
  module: {
    loaders: [
      { test: /\.js$/, exclude: /node_modules/, loaders: ["babel"] },
      { test: /\.css$/, loaders: ["style", "css"] },
    ],
  },
};

However, when I run the program, I get below error message:

(node:8944) ExperimentalWarning: The ESM module loader is experimental.
file:///C:/Users/G-L%20SYSTEMS/Desktop/js-dev-env-demo/webpack.config.dev.js:7
  entry: [path.resolve(__dirname, "js--demodev-env/src/index")],
                       ^

***ReferenceError: __dirname is not defined***
    at file:///C:/Users/G-L%20SYSTEMS/Desktop/js-dev-env-demo/webpack.config.dev.js:7:24
    at ModuleJob.run (internal/modules/esm/module_job.js:139:37)
    at Loader.import (internal/modules/esm/loader.js:179:24)
ERROR: "open:src" exited with 1.

Any help please?

Binah
  • 11
  • 2
  • There is no `__dirname` when using ESM modules. You have to hack it with `import.meta.url`. Your question is also tagged `webpack` so you may have other file access limitations because of the bundling. – jfriend00 Sep 22 '20 at 01:43

0 Answers0