Physijs-webpack 库因要求而失败答案

【问题标题】：Physijs-webpack library fails by requirePhysijs-webpack 库因要求而失败
【发布时间】：2017-08-19 19:10:51
【问题描述】：

在 web 应用程序中，我已经有一些用“require”声明并被 webpack 理解的包：

三个
三轨道控制

我就是这样使用它的：

var THREE = require('three');

var OrbitControls = require('three-orbit-controls')(THREE);

为了添加物理，我尝试添加库 physijs-webpack：

var PhysiJS = require('physijs-webpack')(THREE);

它在“npm run build”失败时说：未找到模块：错误：无法解析“physijs-webpack”

在控制台（Chrome 开发工具）中显示以下错误：

"app.js:17 Uncaught Error: Cannot find module "physijs-webpack"
    at webpackMissingModule (app.js:17)
    at Object.defineProperty.value (app.js:17)
    at __webpack_require__ (bootstrap 460ca68f8e6f1e90ea58:19)
    at Object.<anonymous> (html5-entities.js:190)
    at __webpack_require__ (bootstrap 460ca68f8e6f1e90ea58:19)
    at module.exports.ctor.super_ (bootstrap 460ca68f8e6f1e90ea58:62)"

这是我的 webpack.config 文件：

var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry: './src/js/app.js',
    devtool: 'inline-source-map',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: '/dist'
    }
};

依赖项是：

    "devDependencies": {
        "script-loader": "^0.7.0",
        "webpack": "^3.5.4",
        "webpack-dev-server": "^2.7.1",
        "yarn": "^0.27.5"
    },
    "dependencies": {
        "physijs": "^0.0.4",
        "physijs-webpack": "^0.0.2",
        "requirejs": "^2.3.4",
        "three": "^0.86.0",
        "three-orbit-controls": "^82.1.0"
    }
}

您能否推荐一下，我做错了什么？

【问题讨论】：

标签： webpack physijs

【解决方案1】：

我按照@https://github.com/agilgur5/physijs-webpack找到的 webpack 详细信息遇到并解决了这个问题

基本上...

npm install -S agilgur5/physijs-webpack

和

npm install -D worker-loader

我还必须更新我的 webpack 配置

// webpack.config.js
{
  module: {
    rules: [
      {
        test: /\.worker\.js$/,
        use: { loader: 'worker-loader' }
      }
    ]
  }
}

参考：

【讨论】：

您好，根据我的回答，您不需要更新您的 webpack 配置。 physijs-webpack 实际上使用内联加载器来达到这个目的：所以用户不需要更改他们的配置。此外，库中的工作文件甚至没有 .worker.js 扩展名，因此您编写的规则甚至不适用于它（因此对使其工作没有影响）。感谢您在我有机会看到它之前回答这个问题！

【解决方案2】：

tl;dr - 您一直在使用由其他人发布的损坏版本。使用v0.1.0或以上并阅读https://github.com/agilgur5/physijs-webpack/的说明

大家好，我是physijs-webpack repo 的创建者。

根据old version of the README 和Twitter thread，我的端口一直在进行中，直到 2018 年 9 月我决定再试一次。其他人在没有告诉我的情况下将我的 repo 发布到了 NPM，因此您最初在 NPM 上找到的包已损坏。

在 2018 年 9 月，我重写了大部分 repo，并设法找到了让它工作的方法。当时，我要求人们通过agilgur5/physijs-webpack 安装，因为我无法控制 NPM 包。那个月晚些时候，我获得了对软件包的控制权，现在已经发布了 v0.1.0 和 v0.1.1，它们具有成功且有效的构建。现在您可以通过 physijs-webpack 安装并按照包或 repo 的说明使其工作 - 即也将 worker-loader 安装为 devDependency。

旧的、不工作的 NPM 版本 (v0.0.2) 也将很快取消发布，以避免这样的混乱。

在您的 Webpack 配置中：

这里的另一个答案是更新您的 Webpack 配置，但那是 不正确 和无关的（它甚至没有 .worker.js 扩展名）。 physijs-webpack 实际上专门和有意使用in-line loader，所以你根本不需要更新你的webpack配置。 p>

关于physijs NPM 包：

我还注意到你的package.json 中有physijs——NPM 包是由同一个人创建的，是physijs-webpack 的副本。它于 2018 年 9 月未发布，同时我获得了 physijs-webpack NPM 包的所有权。

关于three 集成：

我注意到的另一件事是three 在您的package.json 中。虽然这是早期非工作版本所必需的，但在当前工作版本中，它现在是 peerDependency。您不再需要将 THREE 作为参数传递，但您仍然需要安装它，因为大多数 PhysiJS 的使用都需要您使用三个。它也被固定到了 THREE 的 r73 版本，因为那是 PhysiJS 支持/兼容的最后一个版本。

【讨论】：