1

如何在 webpack react 应用程序中使用这个 repo:https ://github.com/chris-ruadmin/Recorderjs

我已经创建了一个新的库并以 es6 模块样式导出了主文件。

我使用 webpack 构建,但是当我尝试使用该包时会出现问题。我可以使用:

import Recorder from 'audio-recorder';
var recorder = new Recorder();

但是一旦我尝试对其进行编码,然后使用 WebWorker,据我所知,这需要是 js 文件的路径。

所以问题分为两部分:

  1. 我应该如何设置 webpack 来处理这样的依赖?
  2. 在开发过程中,如何让 webpack 开发服务器提供静态文件?

理想情况下,我想为这个库的所有部分创建模块,并在任何项目中轻松使用它。

最后,这个项目的编码器是通过 emscripten 编译的,我不确定如何在 webpack 中处理这样的文件。是否可以在没有 webpack 触摸的情况下通过它?

谢谢

4

2 回答 2

0

为 webpack 设置依赖项的最简单方法是使用 npm - 它支持从 github 安装。

npm install https://github.com/chris-rudmin/Recorderjs

然后您可以按模块名称(在package.json中定义)导入模块:

import Recorder from 'opus-recorder';
var recorder = new Recorder();

webpack.config.js 应该如下所示:

module.exports = {
    entry: "./main.js",
    output: {
        path: __dirname,
        filename: "bundle.js"
    },
    module: {
        loaders: [
            { test: /\.js$/, loader: "babel" }
        ]
    }
};

不要忘记安装babel-loader以启用 ES6 模块导入。

使用webpack 的文档来设置开发服务器。

你可以告诉 webpack 不要碰“外部”模块。

于 2015-10-14T08:35:35.150 回答
0

您可以使用这个 npm 模块 - https://www.npmjs.com/package/recorder-js这是一个 es6 兼容的包装器,可以通过 webpack 轻松使用。

于 2018-05-03T16:28:27.527 回答