Node.js + Typescript + Webpack = 找不到模块

Question

我是 Webpack、Node.js 和 Typescript 的新手，我在配置我的开发环境时遇到问题。

当运行 webpack 编译我的 src/server.ts 生成 /server/bundle.js 我得到这个错误：

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

项目的架构是：

src/server.ts:

import * as Hapi from 'hapi';

const server = new Hapi.Server();

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'
      }
    ]
  }
};

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：是 webpack 2

更新

安装 hapi 并将 .js 添加到 webpack 的解析扩展和 node 作为 webpack 的目标后，我在 hapi 模块中遇到了这个错误：

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

Answer 1

您没有安装 hapi。 @types/hapi 只是 TypeScript 用于库的类型定义，而不是实际的库本身。所以你还需要添加hapi：

npm install --save hapi

一旦你安装了它，就可以找到模块，尽管你会得到一个新的错误，即 ./server 无法在 hapi/lib/index.js 中解决，那是因为你配置了 resolve.extensions 仅包含 .ts，但库在停止扩展时使用 Node 自动解析 .js。所以你还需要在扩展名中包含 .js：

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

同样解决了这个问题之后，你还会面临另一个问题，就是像fs这样的Node内置模块无法解决。默认情况下，webpack 为 web 构建，因此 Node 内置模块不可用。但是您可以通过将 webpack 配置中的 target 选项设置为 node:

来更改它

target: 'node'

编辑

您在使用其他 node_modules 时遇到了问题，因为您只使用了顶层 node_modules，而您希望始终回退到 node_modules 的常规模块分辨率，所以resolve.modules 应该是这样的：

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

Node.js + Typescript + Webpack = 找不到模块

Node.js + Typescript + Webpack = Module not found

javascript

node.js

typescript

webpack

webpack-2

OBS：是 webpack 2

更新

编辑