Javascript 找不到模块包

在开发过程中的某个地方，这个错误开始显现出来，我无法确定它来自何处。就我所知，错误在于“宽泛”。我用的是网页和大口大口。如果有人能给我指出正确的方向

我可以发布更多的代码，但你需要告诉我哪些文件。应用程序可以正常工作、休息、页面加载等。。只有css没有显示

Starting gatling-rsync-deamon...

Starting containers...
Starting vagrant_redis_1
Starting vagrant_mongo_1
Starting vagrant_app_1
Connection to 127.0.0.1 closed.

 launching stream...
[14:39:00] Requiring external module babel-register
[14:39:14] Using gulpfile /var/www/app/gulpfile.babel.js
[14:39:14] Starting 'set-dev-env'...
NODE_ENV will be set to development...
[14:39:14] Finished 'set-dev-env' after 310 μs
[14:39:14] Starting 'backend-watch'...
[14:39:14] Backend warming up...
[14:39:14] Starting 'frontend-watch'...
[14:39:15] Finished 'frontend-watch' after 694 ms
[14:39:15] Starting 'server'...
[14:39:15] Finished 'server' after 1.55 ms
Webpack-dev-server listening at localhost:9090.

module.js:340
    throw err;
          ^
Error: Cannot find module '/var/www/app/build/bundle'
    at Function.Module._resolveFilename (module.js:338:15)
    at Function.Module._load (module.js:280:25)
    at Function.Module.runMain (module.js:497:10)
    at startup (node.js:119:16)
    at node.js:945:3
[14:39:20] Finished 'backend-watch' after 5.25 s
[14:39:20] Starting 'dev'...
[14:39:20] Finished 'dev' after 3.46 μs
Hash: 5e15e9e5b2fd1c868120
Version: webpack 1.13.0

gulpfile.babel.js

import webpack from 'webpack';
import WebpackDevServer from 'webpack-dev-server';
import gulp from 'gulp';
import gutil from 'gulp-util';
import nodemon from 'nodemon';
import path from 'path';
import jsdoc from 'gulp-jsdoc3';
import WebpackDevMiddleware from 'webpack-dev-middleware';
import webpackHotMiddleware from 'webpack-hot-middleware';
// import backendConfig from './config/webpack.backend.config.js';
// import frontendConfig from './config/webpack.frontend.config.js';

import configs from './config/webpack.config';
import jsdocConfig from './config/jsdoc.config';

const [frontendConfig, backendConfig] = configs;


const FRONTEND_PORT = 8085;
const BACKEND_PORT = 9090;

function onBuild(err, stats) {
  if (err) {
    throw new Error(err);
  }
  console.log(stats.toString());
}

// Default: list all tasks.
gulp.task('default', () => {
  console.log('Available commands: dev, build');
});

// Start frontend
gulp.task('frontend', (done) => {
  webpack(frontendConfig).run((err, stats) => {
    onBuild(err, stats);
    done();
  });
});

// Start frontend watch
gulp.task('frontend-watch', () => {
  const webpackDevserver = new WebpackDevServer(webpack(frontendConfig), {
    publicPath: frontendConfig.output.publicPath,
    stats: { colors: true },
    historyApiFallback: true,
    proxy: {
      '*': `http://localhost:${BACKEND_PORT}`
    }
  });
  webpackDevserver.listen(BACKEND_PORT, 'localhost', (err, result) => {
    if (err) {
      console.log(err);
    }
    else {
      console.log(`Webpack-dev-server listening at localhost:${BACKEND_PORT}.`);
    }
  });
});

// Start backend
gulp.task('backend', (done) => {
  webpack(backendConfig).run((err, stats) => {
    onBuild(err, stats);
    done();
  });
});

// Start backend watch
gulp.task('backend-watch', (done) => {
  gutil.log('Backend warming up...');
  let firedDone = false;

  webpack(backendConfig).watch(100, (err, stats) => {
    if (!firedDone) { done(); firedDone = true; }
    onBuild(err, stats);
    nodemon.restart();
  });
});

// 
// gulp.task('run', ['set-dev-env', 'backend-watch'], () => {
//   nodemon({
//     execMap: {
//       js: 'node'
//     },
//     script: path.join(__dirname, 'build/backend'),
//     ignore: ['*'],
//     watch: ['foo/'],
//     ext: 'noop'
//   }).on('restart', () => {
//     console.log('Patched!');
//   });
// });

// Set NODE_ENV to development
gulp.task('set-dev-env', () => {
  console.log('NODE_ENV will be set to development...');
  process.env.NODE_ENV = 'development';
});

// Set NODE_ENV to production
gulp.task('set-prod-env', () => {
  console.log('NODE_ENV will be set to production...');
  process.env.NODE_ENV = 'production';
});

// Start server
gulp.task('server', () => {
  nodemon({
    execMap: {
      js: 'node'
    },
    script: path.join(__dirname, 'build/bundle'),
    ignore: ['*'],
    watch: ['foo/'],
    ext: 'noop'
  }).on('restart', () => {
    console.log('Server restarted!');
  });
});

// Generate docs
gulp.task('docs', (cb) => {
  // gulp.src(['README.md', './client/**/*.js', './server/**/*.js'], { read: false })
  //       .pipe(jsdoc(jsdocConfig, cb));
});

// Build project
gulp.task('build', ['set-prod-env', 'build-js']);

// Build backend & frontend
gulp.task('build-js', ['backend', 'frontend']);

// Watch backend & frontend
gulp.task('watch', ['backend-watch', 'frontend-watch']);

// Start development session
gulp.task('dev', ['set-dev-env', 'backend-watch', 'frontend-watch', 'server']);

webpack.config

import webpack from 'webpack';
import path from 'path';
import fs from 'fs';
import HtmlWebpackPlugin from 'html-webpack-plugin';
const embedFileSize = 50000;

const nodeModules = {};
fs.readdirSync('node_modules')
  .filter(module => {
    return ['.bin'].indexOf(module) === -1;
  })
  .forEach(mod => {
    nodeModules[mod] = 'commonjs ' + mod;
  });

const frontendConfig = {
  entry: [
    'webpack-hot-middleware/client',
    path.join(__dirname, '../client/index.js')
  ],

  output: {
    filename: 'bundle.js',
    path: path.join(__dirname, 'build', 'public')
  },

  devtool: 'sourcemap',

  plugins: [
    new HtmlWebpackPlugin({
      template: './client/public/index.html',
      inject: 'body',
      filename: 'index.html'
    }),
    new webpack.ProvidePlugin({
      'Promise': 'es6-promise',
      'fetch': 'imports?this=>global!exports?global.fetch!whatwg-fetch'
    }),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin(),
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify('development'),
      '__DEV__': JSON.stringify(process.env.NODE_ENV)
    })
  ],

  module: {
    preloaders: [
      { test: /\.js$/, loader: 'eslint'}
    ],
    loaders: [
      {
        test: /\.js?$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      },
      {
        test: /\.json?$/,
        loader: 'json'
      },
      {
        test: /\.css$/,
        loader: 'style-loader!css-loader?modules&&importLoaders=1&localIdentName=[name]---[local]---[hash:base64:5]!postcss-loader'
      },
      {
        test: /\.less$/,
        loader: "style!css!less"
      },
      { test: /\.svg/,
        loader: 'url?limit=' + embedFileSize + '&mimetype=image/svg+xml'
      },
      { test: /\.png$/,
        loader: 'url?limit=' + embedFileSize + '&mimetype=image/png'
      },
      { test: /\.jpg/,
        loader: 'url?limit=' + embedFileSize + '&mimetype=image/jpeg'
      },
      { test: /\.gif/,
        loader: 'url?limit=' + embedFileSize + '&mimetype=image/gif'
      },
      {
        test: /\.(otf|eot|ttf|woff|woff2)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
        loader: 'url?limit=' + embedFileSize
      }
    ]
  },
  resolve: {
    extensions: ['', '.js', '.jsx', '.json', '.css']
  },
};

const serverConfig = {
  entry: './server/server.js',
  output: {
    path: path.join(__dirname, '../build'),
    filename: 'bundle.js'
  },

  devtool: 'sourcemap',

  target: 'node',
  // do not include polyfills or mocks for node stuff
  node: {
    console: false,
    global: false,
    process: false,
    Buffer: false,
    __filename: false,
    __dirname: false
  },
  externals: nodeModules,

  plugins: [
    // enable source-map-support by installing at the head of every chunk
    new webpack.BannerPlugin('require("source-map-support").install();',
      {raw: true, entryOnly: false})
  ],

  module: {
    loaders: [
      {
        // transpile all .js files using babel
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel'
      }
    ]
  }
};

export default [frontendConfig, serverConfig];

---

我现在的答案是基于你粘贴的代码。当我获得更多信息时，我将编辑此答案

---

我不确定我是否能为您找到远程正确的解决方案。但您的问题可能是添加到webpack和WebpackDevServer的公共路径。WebpackDevServer没有看到捆绑在bundle中的js代码。js

我现在的答案基于粘贴的代码。当我获得更多信息时，我将编辑此答案

我不确定我是否能为您找到远程正确的解决方案。但您的问题可能是添加到webpack和WebpackDevServer的公共路径。WebpackDevServer看不到捆绑在捆绑包中的js代码。js将目标更改为“web”而不是节点。您应该针对web类型的环境进行编译，而不是类似node.js的环境

target: 'web',

将目标更改为“web”而不是节点。您应该针对web类型的环境进行编译，而不是类似node.js的环境

target: 'web',

---

请显示gulpfile.js和gulpfile.babel.jscode@KrzysztofSztompka谢谢你的关注。更新。请同时显示。/config/webpack.config请显示gulpfile.js和gulpfile.babel.jscode@KrzysztofSztompka谢谢你的关注。更新了。请同时显示。/config/webpack.config无法回忆起在这两个文件中更改了什么，奇怪。我又更新了。我记不起在两个文件中更改了什么，奇怪。我已再次更新。错误：在WebPackageMissingModule中找不到模块“fs”。已找到。fs.readdirSync（'node_modules'）^TypeError:Object#没有方法'readdirSync'顺便说一句，我原来的错误仍然存在。我认为这不是正确的方法。嗯，我必须道歉，我记得我收到了相同的问题，我提供的这些解决方案已经为我解决了它。此外，我还尝试了您在“fs.readdirSync（'node_modules'）中使用的方法，该方法删除了重复的节点模块。我完全剥离了我的上一个网页，一切都很好。我知道如果你这样做，你的构建过程会更快，但当我使用这种技术时，它给我带来了很多问题。错误：在webpackMissingModule上找不到模块“fs”。已经找到了。fs.readdirSync（'node_modules'）^TypeError:Object#没有方法'readdirSync'顺便说一句，我原来的错误仍然存在。我认为这不是正确的方法。嗯，我必须道歉，我记得我收到了相同的问题，我提供的这些解决方案已经为我解决了它。此外，我还尝试了您在“fs.readdirSync（'node_modules'）中使用的方法，该方法删除了重复的节点模块。我完全剥离了我的上一个网页，一切都很好。我知道如果你这样做，你的构建过程会更快，但当我使用这种技术时，它给我带来了很多问题。