Question

我试图通过webpack尝试使用名为@soil/dom的npm包，只需执行以下操作：

import {h} from '@soil/dom'

但是在运行webpack时，我收到了这些警告和错误：

WARNING in ./node_modules/@soil/dom/build/index.js 3:24-31
Critical dependency: require function is used in a way in which dependencies cannot be statically extracted
 @ ./src/index.ts

ERROR in ./node_modules/@soil/dom/build/index.js
Module not found: Error: Can't resolve './html/h' in '/home/daniel/Code/time-flies/node_modules/@soil/dom/build'
 @ ./node_modules/@soil/dom/build/index.js 7:8-70
 @ ./src/index.ts

我的package.json文件如下所示：

{
  "dependencies": {
    "@soil/dom": "0.6.0"
  },
  "devDependencies": {
    "typescript": "2.9.1",
    "ts-loader": "4.4.1",
    "webpack": "4.12.0",
    "webpack-cli": "3.0.3"
  }
}

我的webpack.config.js文件如下所示：

const path = require('path')

module.exports = {
    mode: 'production',
    entry: './src/index.ts',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist')
    },
    resolve: {
        extensions: ['.ts']
    },
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: 'ts-loader',
                exclude: /node_modules/
            }
        ]
    }
}

在@soil/dom方面，npm包的目录结构如下所示：

@soil/
└── dom
    ├── build
    │   ├── html
    │   │   ├── h.js
    │   │   └── ...
    │   ├── index.js
    │   └── ...
    ├── package.json
    └── ...

package.json包含：

{
    "main": "build/index.js"
}

index.js文件包含（它已针对UMD模块系统进行编译）：

var h_1 = require("./html/h");
exports.h = h_1.h;

为什么webpack能够在此时解析相对路径'./html/h'？这张照片中缺少什么？

Webpack + TypeScript：找不到模块

0 个答案: