Posted on

Fixing webpack error: Path must be a string. Received undefined

If you try to set up webpack and Typescript, you can get some strange errors like so:

ERROR in ./src/lecture_search/LectureSearchConfig.ts
Module build failed: TypeError: Path must be a string. Received undefined
    at assertPath (path.js:7:11)
    at Object.dirname (path.js:697:5)
    at ensureTypeScriptInstance (D:\projects\image-annotation\node_modules\ts-loader\index.js:156:103)
    at Object.loader (D:\projects\image-annotation\node_modules\ts-loader\index.js:403:14)
 @ ./src/lecture_search/LectureSearchApp.jsx 42:13-45

What is happening is the Typescript loader is looking for a tsconfig.json, but not bothering to tell you this.

To fix this, create the file, like so:

{
    "compilerOptions": {
    "module": "commonjs",
    "target": "es5",
    "jsx": "react",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "outDir": "dist"
    },
    "files": [
      "./typings/main.d.ts"
    ]
}

Note that the typings file won’t exist until you install type bindings, so if you know you’re going to need a library, now is a good time to set it up:

typings install 'dt!react' --save --ambient