Physijs-webpack图书馆因需要而失败

Question

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

• 三
• 三轨控制

我就是这样用它的：

var THREE = require('three');

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

为了增加物理，我试着增加图书馆的生理-webpack：

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

"npm运行建设“失败:模块未找到:错误:不能解决‘物理-webpack’

在控制台(Chrome dev tools)中，会显示以下错误：

"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"
    }
}

你能告诉我，我做错什么了吗？

Answer 1

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

你好，我是存储库的创造者。

根据自述的旧版本和这个Twitter线程，我的端口一直在进行中，直到2018年9月，我决定再试一次。有人在没有告诉我的情况下就把我的回购报告发布给了NPM，所以你最初在NPM上找到的包已经坏了。

2018年9月，我重写了大部分回购程序，并设法想出了一种让它开始工作的方法。当时，我要求人们通过agilgur5/physijs-webpack安装，因为我没有对NPM软件包的控制。那个月的晚些时候，我被授予了包的控制权，现在我已经发布了一个版本0.1.0和v0.1.1，这些版本的构建都很成功。现在，您可以通过physijs-webpack进行安装，并按照软件包或回购程序的指示进行安装--也就是将worker-loader安装为devDependency。

旧的，不工作的NPM版本(v0.0.2)也将在短期内被取消，以避免像这样的混乱。

你的Webpack配置：

这里的另一个答案是更新Webpack配置，但这是不正确的和无关的(它甚至没有一个.worker.js扩展)。实际上，physijs-webpack专门并有意地使用在线装载机，这样您就完全不必更新webpack配置了。

关于physijs国家预防机制一揽子计划：

我还注意到你的physijs在你的package.json中-- NPM包是由同一个人创建的，是physijs-webpack的复制。它在2018年9月未发表，与此同时，我获得了physijs-webpack国家预防机制一揽子计划的所有权。

关于three集成：

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

Answer 2

我遇到并解决了这个问题，通过跟踪webpack的详细信息找到@ https://github.com/agilgur5/physijs-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' }
      }
    ]
  }
}

参考资料：

• https://github.com/agilgur5/physijs-webpack
• https://github.com/webpack-contrib/worker-loader