CODEWITHSUNDEEP
javascriptnode.jstypescriptwebpackwebpack-2
Giovane
Giovane

Reputation: 1451

Node.js + Typescript + Webpack = Module not found

I'm new with Webpack, Node.js and Typescript and I'm having trouble configuring my dev enviroment.

When running webpack to compile my src/server.ts to generate the /server/bundle.js I'm getting this error:

ERROR in ./src/server.ts
Module not found: Error: Can't resolve 'hapi' in '/Volumes/Dados/giovane/dev/studio-hikari/nodang/nodang-api/src'
 @ ./src/server.ts 3:11-26

The architecture of the project is:

enter image description here

The src/server.ts:

import * as Hapi from 'hapi';

const server = new Hapi.Server();

The webpack.config.js:

const path = require('path');

module.exports = {
  entry: './src/server.ts',
  output: {
    filename: './server/bundle.js'
  },
  resolve: {
    extensions: ['.ts'],
    modules: [
      path.resolve('src'),
      path.resolve('node_modules')
    ]
  },
  module: {
    loaders: [
      {
        test: /.ts$/,
        loader: 'awesome-typescript-loader'
      }
    ]
  }
};

The package.json:

{
  "name": "nodang-api",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "compile": "webpack --progress --watch",
    "serve": "node-dev server/bundle.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@types/hapi": "^16.0.0",
    "lodash": "^4.17.4"
  },
  "devDependencies": {
    "awesome-typescript-loader": "^3.0.8",
    "tsd": "^0.6.5",
    "typescript": "^2.2.1",
    "webpack": "^2.2.1"
  }
}

OBS: It's webpack 2

UPDATE

After installing hapi and adding .js to webpack's resolve extentions and node as webpack's target I'm getting this erros with hapi modules:

ERROR in ./~/hapi/lib/server.js
Module not found: Error: Can't resolve 'catbox' in '/Volumes/Dados/giovane/dev/studio-hikari/nodang/nodang-api/node_modules/hapi/lib'
 @ ./~/hapi/lib/server.js 5:15-32
 @ ./~/hapi/lib/index.js
 @ ./src/server.ts

ERROR in ./~/hapi/lib/server.js
Module not found: Error: Can't resolve 'catbox-memory' in '/Volumes/Dados/giovane/dev/studio-hikari/nodang/nodang-api/node_modules/hapi/lib'
 @ ./~/hapi/lib/server.js 6:21-45
 @ ./~/hapi/lib/index.js
 @ ./src/server.ts

Upvotes: 4

Views: 8941

Answers (1)

Michael Jungo
Michael Jungo

Reputation: 32972

You did not install hapi. @types/hapi are just the type definitions that TypeScript uses for the library, but not the actual library itself. So you need to add hapi as well:

npm install --save hapi

Once you've installed it, the module can be found, although you'll get a new error that ./server could not be resolved in hapi/lib/index.js and that's because you configure resolve.extensions to only include .ts, but the library makes use of Node automatically resolving .js when leaving off the extension. So you also need to include .js in the extensions:

extensions: ['.ts', '.js'],

After also resolving this issue, you'll be faced with another one, namely that Node built-in modules like fs can't be resolved. By default webpack builds for the web, so the Node built-in modules are not available. But you can change that by setting the target option in your webpack config to node:

target: 'node'

Edit

You're having trouble with other node_modules because you only use the top level node_modules, instead you want to always fall back to the regular module resolution of node_modules, so the resolve.modules should look like this:

modules: [
  path.resolve('src'),
  'node_modules'
]

Upvotes: 8

Related Questions