web-dev-qa-db-ja.com

Webpack Expressはモジュール 'fs'を解決できません。リクエストの依存関係は式です

Expressをプロジェクトに含めると、webpackでビルドしようとすると常にこれらのエラーが発生します。

webpack.config.dev.js

var path = require("path")

module.exports = {
  entry: {
    "server": "./server/server.ts"
  },
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "bundle.js",
    publicPath: "/public/"
  },
  module: {
    loaders: [
      {
        test: /\.ts(x?)$/,
        exclude: /node_modules/,
        loader: "ts-loader"
      }, {
        test: /\.js(x?)$/,
        exclude: /node_modules/,
        loader: "babel-loader"
      }, {
        test: /\.json$/,
        loader: "json-loader"
      }, {
        test: /\.scss$/,
        exclude: /node_modules/,
        loaders: ["style-loader", "css-loader", "postcss-loader", "sass-loader"]
      }, {
        test: /\.css$/,
        loader: ["style-loader", "css-loader", "postcss-loader"]
      }, {
        test: /\.(jpe?g|gif|png|svg)$/i,
        loader: 'url-loader?limit=10000'
      }
    ]
  }
}

私はもう試した：

  1. 「fs」をインストールしても動作しません

  2. ノードのfsプロパティを変更するには、どこかを読んでください。エラー警告は削除されますが、これが永続的な解決策としては良いとは思いません。

    module.exports = {
  node: {
    fs: "empty"
  }
}

    時間：2496msアセットサイズチャンクチャンク名bundle.js 761 kB 0 [emitted] server bundle.js.map 956 kB 0 [emitted] server + 119隠しモジュール

    ./~/express/lib/view.jsの警告重要な依存関係：78：29-56依存関係のリクエストは式です@ ./~/express/lib/view.js 78：29-56 ./のエラー〜/ express/lib/view.js

    モジュールが見つかりません：エラー：/ Users/clementoh/Desktop/boilerplate2/node_modules/express/lib @ ./~/express/lib/view.jsのモジュール 'fs'を解決できません./~/の18：9-22エラーsend/index.js

    モジュールが見つかりません：エラー：/ Users/clementoh/Desktop/boilerplate2/node_modules/send @ ./~/send/index.jsのモジュール 'fs'を解決できません。/~/etag/indexのエラー24：9-22 js

    モジュールが見つかりません：エラー：/ Users/clementoh/Desktop/boilerplate2/node_modules/etag @ ./~/etag/index.js 22：12-25 ./~/destroy/indexのエラーでモジュール 'fs'を解決できません。 js

    モジュールが見つかりません：エラー：/ Users/clementoh/Desktop/boilerplate2/node_modules/destroy @ ./~/destroy/index.jsのモジュール 'fs'を解決できません。14/ 17-30 ./~/mime/mimeのエラー。 js

    モジュールが見つかりません：エラー：/ Users/clementoh/Desktop/boilerplate2/node_modules/mime @ ./~/mime/mime.js 2：9-22のモジュール 'fs'を解決できません

javascriptnode.jswebpack
28
Clement

誰もがSOについてコメントを読んでいないため、答えを投稿するだけです。 @ Aurora0001が釘付けにしました。 Webpackの設定には次の設定が必要です。

"target": "node"
49
Christopher Davies

私はスタック上にいますAngular 2-Electron-Webpackと私は私のサービスにfsを使用する必要がありました、私は最終的にどのようにするかを見つけました：

1）webpack.common.js内で、target:'electron-renderer'を指定します

2）サービスまたはコンポーネントの内部：import * as fs from 'fs';で、ノードプロジェクトの場合と同様にfsを使用します。

それが役立つことを願っています！

4
Wetteren Rémi

この問題は2つのステップで解決しました。

  1. node_modulesディレクトリを削除します

  2. target:'node'をwebpack構成ファイルに追加します

次にnpm installを実行します。私にとってはうまくいきました。

3
Osman Goni Nahid

追加した node: { fs: 'empty' }運がなければ、

次に、コマンドを開始するために--configを追加しました。

webpack-dev-sever webpack.config.dev.js

--configフラグを使用して、カスタムファイルを使用します。

webpack-dev-sever --config webpack.config.dev.js

2
Kevin Danikowski

Angular V6以上の場合の作業ソリューション/ハック/パッチ

私にとっての解決策は、Angular-CLIモジュールをハッキングして、欠落しているノードモジュールを偽装することでした。

インストール後、次のファイルを見つけます。

node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js

node行を見つけて、これを追加します。

node: { crypto: true, stream: true, fs: 'empty', net: 'empty' }

以上です！！！

???????????????????????

注：パッケージを更新するたびに、このパッチを実行する必要があります。したがって、このスクリプトを使用します。

package.json

"scripts": {
  ...
  "postinstall": "node patch-webpack.js"
  ...
}

patch-webpack.js

const fs = require('fs');
const f = 'node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js';

fs.readFile(f, 'utf8', function (err,data) {
  if (err) {
    return console.log(err);
  }
  let result = data.replace(/node: false/g, "node: {crypto: true, stream: true, fs: 'empty', net: 'empty'}");

  fs.writeFile(f, result, 'utf8', function (err) {
    if (err) return console.log(err);
  });
});

ソース： https://blog.lysender.com/2018/07/angular-6-cannot-resolve-crypto-fs-net-path-stream-when-building-angular/

0
jpthor

"target": "node",を追加するには、webpack.config.jsに追加します。

0
el-Joft