Webpack can't find package.json

[ricardorauber]

Hi, I am having some issues trying to use Webpack with module-alias. My project was developed in TypeScript and the generated code (this part works fine) goes through Webpack and I am having issues trying to run it after Webpack. I will start showing my setup:

package.json

{
    ...
    "_moduleAliases": {
        "core": "build/core"
    },
    "devDependencies": {
        ...
        "webpack": "^4.30.0"
    },
    "dependencies": {
        "module-alias": "^2.2.0"
    }
}

webpack.config.js

const npm_package = require('./package.json')
const webpack = require('webpack')
const path = require('path')

let moduleAliases = {}
Object.keys(npm_package._moduleAliases).every(alias => {
    moduleAliases[alias] = path.resolve(__dirname, npm_package._moduleAliases[alias])
})

module.exports = {
    entry: './build/app.js',
    target: 'node',
    mode: 'production',
    output: {
        path: path.join(__dirname, 'dist'),
        filename: 'app.js'
    },
    resolve: {
        alias: moduleAliases
    },

The first issue comes when running webpack:

WARNING in ./node_modules/module-alias/index.js 158:19-63
Critical dependency: the request of a dependency is an expression
 @ ./node_modules/module-alias/register.js
 @ ./build/app.js

And then when trying to run the final source, I get this:

Error: Unable to find package.json in any of:
[/,
/Users/.../ts-be]
    at e.exports (/Users/.../ts-be/dist/app.js:1:2503)
    at Object.<anonymous> (/Users/.../ts-be/dist/app.js:1:1136)
    at t (/Users/.../ts-be/dist/app.js:1:172)
    at Object.<anonymous> (/Users/.../ts-be/dist/app.js:1:1053)
    at t (/Users/.../ts-be/dist/app.js:1:172)
    at /Users/.../ts-be/dist/app.js:1:964
    at Object.<anonymous> (/Users/.../ts-be/dist/app.js:1:973)
    at Module._compile (internal/modules/cjs/loader.js:734:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:745:10)
    at Module.load (internal/modules/cjs/loader.js:626:32)

It seems like module-alias is not being loaded by webpack, because if I try without it, webpack works just fine. The sample code to work with webpack in readme.md is outdated, so I would like to ask if there is anything I should do that I missed or did wrong.

Thanks!

[ricardorauber]

I managed to reduce it to a very simple project, so here it is:

ts-be.zip

[Kehrlann]

Hi Ricardo !

module-alias is not designed to be used in combination with webpack - it's for node apps, that run in the backend. So that won't work.

However, you can do what module-alias does in two ways:

• By configuring the Typescript compiler itself, using path mapping: https://www.typescriptlang.org/docs/handbook/module-resolution.html#path-mapping . I recommend you try this first. In you tsconfig.json, you would put something like:

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "core": ["build/core"]
    }
  }
}

• One other way would be using Webpack's module resolution, see: https://webpack.js.org/configuration/resolve/

Hope the above helps ; I'll close the issue.

Cheers !

[ceduth]

Dear Ricardo, are you requiring module-alias/register.js somewhere? If so, rather, hook into module-alias directly, eg.

let moduleAliases = {}
...
const moduleAlias = require('module-alias')
moduleAlias.addAliases(moduleAliases)

Rgds!