javascript - 安装 npm 依赖项 webtorrent - 错误 : Can't resolve 'fs' - Fountain-Js (Yeoman)

Question

你好，我在尝试在我的代码中安装 NPM 依赖项时遇到了麻烦。

我用这个命令安装了模块: npm install --save webtorrent

这是我的 package.json

./package.json

{
"dependencies": {
  "angular": "^1.5.0",
  "angular-ui-router": "1.0.0-beta.1",
  "webtorrent": "^0.97.2"
},
"devDependencies": {
  "angular-mocks": "^1.5.0-beta.2",
  "gulp-angular-templatecache": "^1.8.0",
  "del": "^2.0.2",
  "gulp": "gulpjs/gulp#4ed9a4a3275559c73a396eff7e1fde3824951ebb",
  "gulp-hub": "frankwallis/gulp-hub#d461b9c700df9010d0a8694e4af1fb96d9f38bf4",
  "gulp-filter": "^4.0.0",
  "gulp-util": "^3.0.7",
  "gulp-angular-filesort": "^1.1.1",
  "gulp-htmlmin": "^1.3.0",
  "gulp-insert": "^0.5.0",
  "gulp-ng-annotate": "^1.1.0",
  "gulp-sass": "^2.1.1",
  "browser-sync": "^2.9.11",
  "browser-sync-spa": "^1.0.3",
  "karma": "^1.3.0",
  "karma-coverage": "^1.1.1",
  "karma-jasmine": "^1.0.2",
  "karma-junit-reporter": "^1.1.0",
  "jasmine": "^2.4.1",
  "es6-shim": "^0.35.0",
  "karma-angular-filesort": "^1.0.0",
  "karma-ng-html2js-preprocessor": "^0.2.0",
  "karma-phantomjs-launcher": "^1.0.0",
  "karma-phantomjs-shim": "^1.1.2",
  "phantomjs-prebuilt": "^2.1.6",
  "babel-plugin-istanbul": "^2.0.1",
  "karma-webpack": "^1.7.0",
  "webpack": "2.1.0-beta.20",
  "html-webpack-plugin": "^2.9.0",
  "style-loader": "^0.13.0",
  "css-loader": "^0.23.1",
  "postcss-loader": "^0.8.0",
  "autoprefixer": "^6.2.2",
  "json-loader": "^0.5.4",
  "extract-text-webpack-plugin": "^2.0.0-beta.3",
  "ng-annotate-loader": "^0.0.10",
  "html-loader": "^0.4.3",
  "sass-loader": "^3.1.2",
  "node-sass": "^3.4.2",
  "eslint": "^3.2.2",
  "eslint-config-xo-space": "^0.12.0",
  "eslint-config-angular": "^0.5.0",
  "eslint-plugin-angular": "^1.3.0",
  "eslint-loader": "^1.3.0",
  "babel-loader": "^6.2.0",
  "babel-eslint": "^6.0.2",
  "eslint-plugin-babel": "^3.1.0",
  "babel-core": "^6.13.0",
  "babel-polyfill": "^6.7.4",
  "babel-preset-es2015": "^6.2.0"
},
"scripts": {
  "build": "gulp",
  "serve": "gulp serve",
  "serve:dist": "gulp serve:dist",
  "test": "gulp test",
  "test:auto": "gulp test:auto"
},
"eslintConfig": {
  "globals": {
    "expect": true
  },
  "root": true,
  "env": {
    "browser": true,
    "jasmine": true
  },
  "extends": [
    "xo-space/esnext"
  ]
}

这是index.js文件

./index.js

import angular from 'angular';

import {techsModule} from './app/techs/index';
import {playlistModule} from './app/playlist/index';
import {webtorrent} from 'webtorrent';


import 'angular-ui-router';
import routesConfig from './routes';

import {main} from './app/main';
import {header} from './app/header';
import {title} from './app/title';
import {footer} from './app/footer';

import './index.scss';

angular
  .module('app', [techsModule, playlistModule, 'ui.router'])
  .config(routesConfig)
  .component('app', main)
  .component('fountainHeader', header)
  .component('fountainTitle', title)
  .component('fountainFooter', footer);

这是我要使用 webtorrent 的模块:

./src/app/playlist/playlist.js

import Webtorrent from 'webtorrent';

class PlaylistController {
  contructor() {
    this.TorrentId = 'magnet:?xt=urn:btih:6a9759bffd5c0af65319979fb7832189f4f3c35d&dn=sintel.mp4&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2Fsintel-1024-surround.mp4';
    this.Client = new Webtorrent();
  }
}

export const playlist = {
  templateUrl: "app/playlist/playlist.html",
  controller: PlaylistController,
  bindings: {
    playlist: '<'
  }
};

所以我有这个错误:

ERROR in ./~/create-torrent/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/macbook-lucas/refreex/node_modules/create-torrent'
 @ ./~/create-torrent/index.js 22:9-22
 @ ./~/webtorrent/index.js
 @ ./src/index.js

ERROR in ./~/parse-torrent/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/macbook-lucas/refreex/node_modules/parse-torrent'
 @ ./~/parse-torrent/index.js 7:9-22
 @ ./~/webtorrent/index.js
 @ ./src/index.js

ERROR in ./~/is-file/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/macbook-lucas/refreex/node_modules/is-file'
 @ ./~/is-file/index.js 3:9-22
 @ ./~/create-torrent/index.js
 @ ./~/webtorrent/index.js
 @ ./src/index.js

ERROR in ./~/pump/index.js
Module not found: Error: Can't resolve 'fs' in '/Users/macbook-lucas/refreex/node_modules/pump'
 @ ./~/pump/index.js 3:9-22
 @ ./~/webtorrent/lib/torrent.js
 @ ./~/webtorrent/index.js
 @ ./src/index.js

ERROR in ./~/webtorrent/lib/torrent.js
Module not found: Error: Can't resolve 'fs' in '/Users/macbook-lucas/refreex/node_modules/webtorrent/lib'
 @ ./~/webtorrent/lib/torrent.js 13:9-22
 @ ./~/webtorrent/index.js
 @ ./src/index.js

但问题出在这个 JS 播种器上，因为我试图在一个干净的项目中安装 webtorrent 并且它运行完美，所以我不知道为什么 Yeoman 错误地使用了 fs。

我知道“fs”是 NODE.js 的核心模块，但我尝试安装 fs，但出于安全原因，它只安装了一个虚拟包，所以我卸载了它。

我还尝试使用此命令更新 NPM:

npm 更新 -g npm

但什么都没有。

有了 fs 模块的信息，我就有了这些信息。npm 信息 fs -v3.10.8

Answer 1

你应该看看 webpack 部分 https://github.com/feross/webtorrent .它说明您需要添加几行配置才能使其正常工作。

{
  target: 'web',
  node: {
    fs: 'empty'
  },
  module: {
    loaders: [
      // make sure to install the 'json-loader' package: npm install json-loader
      {
        test: /\.json$/,
        loader: 'json'
      }
    ]
  }
}