webpack2报错module not found error

Question

webpack的配置文件：

const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const webpack = require('webpack'); 
const path = require('path');

const env = process.env.NODE_ENV;

const config = {
      entry: './src/app.js',
      output: {
        path: path.resolve(__dirname, '../dist'),
        filename: 'bundle.js'
      },
      module: {
          rules: [{
              test: /\.less$/,
              use: ExtractTextPlugin.extract({
                fallback: 'style-loader',
                use: ['css-loader', 'less-loader']
            })
          }, {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['es2015', 'react']
            }
        }, {
            test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2)$/,
            loader: 'url-loader?limit=8192'
        }]
      },
      resolve: {
          extensions: ['.js', '.jsx'],
        alias: {
              'meao': path.resolve(__dirname, '../src')
        }
      },
      plugins: [
        new HtmlWebpackPlugin({
            inject: true,
            template: path.resolve(__dirname, 'src/index.html')
        }),
        new ExtractTextPlugin('style.css')
    ]
};

if (env === 'production') {
    config.plugins.push(
        new UglifyJSPlugin()
    );
}

module.exports = config;

package.json的script部分

"scripts": {
    "start": "npm run dev",
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open ./docs/webpack.config.js",
    "build": "cross-env NODE_ENV=production webpack -p --config ./docs/webpack.config.js"
  }

报错

ERROR in ./~/html-webpack-plugin/index.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\eru\Documents\GitHub\meo\node_modules\html-webpack-plugin'
 @ ./~/html-webpack-plugin/index.js 3:9-22
 @ ./docs/webpack.config.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./docs/webpack.config.js

ERROR in ./~/extract-text-webpack-plugin/index.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\eru\Documents\GitHub\meo\node_modules\extract-text-webpack-plugin'
 @ ./~/extract-text-webpack-plugin/index.js 5:9-22
 @ ./docs/webpack.config.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./docs/webpack.config.js

ERROR in ./~/extract-text-webpack-plugin/loader.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\eru\Documents\GitHub\meo\node_modules\extract-text-webpack-plugin'
 @ ./~/extract-text-webpack-plugin/loader.js 5:9-22
 @ ./~/extract-text-webpack-plugin/index.js
 @ ./docs/webpack.config.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 ./docs/webpack.config.js

Answer 1

我也遇到了同样的问题，google了解决方案是在webpack.config.js中加入

 node: {
             fs: 'empty'
        }

完整如下

{
        output:{
            filename: 'vendor.js',
            path: path.resolve(__dirname, 'dist'),
            libraryTarget: 'umd'
        },
        entry: './src/vendor.js',
        devtool: 'source-map',
        mode: 'development',
        node: {
             fs: 'empty'
        }
    },

我照做了，虽然build是成功了，但是事后引用build好的包却是依然报run time error，不知道lz后来解决了没有

补充！经过一番research，我的问题解决了，因为我用webpack打包了，非nodejs写的包（就是那些需要用node-gyp prebuild的那种modules）。解决方案如下

{
        output:{
            filename: 'vendor.js',
            path: path.resolve(__dirname, 'dist'),
            libraryTarget: 'umd'
        },
        entry: './src/vendor.js',
        devtool: 'source-map',
        mode: 'development',
        resolve: {
            alias: {
                'indy-sdk': path.join(__dirname,'node_modules/indy-sdk/build/Release/indynodejs.node')
            }
        },
        module: {
            rules: [
                {test: /\.node$/, use: 'node-loader'}
            ]
        }
    },

Answer 2

提示中的意思，好像是你fs包没有安装，或者你安装了没引入。

Answer 3

fs模块没引入

Answer 4

你可以把app.js的代码贴出来看一下