Question

我正在研究需要在nw.js和浏览器上运行的反应应用程序。这就是为什么我修改了我的webpack配置文件，如下所示。

正如您在配置文件下面看到的那样，我正在使用target: 'node-webkit' 但是我收到了这个错误

Uncaught ReferenceError: require is not defined
    at Object.96 (external "querystring":1)
    at __webpack_require__ (bootstrap 43e7fb751c3d48366505:686)
    at fn (bootstrap 43e7fb751c3d48366505:105)
    at Object.<anonymous> (client.js:14)
    at Object../node_modules/webpack-hot-middleware/client.js?reload=true (client.js:191)
    at __webpack_require__ (bootstrap 43e7fb751c3d48366505:686)
    at fn (bootstrap 43e7fb751c3d48366505:105)
    at Object.97 (main.js:66130)
    at __webpack_require__ (bootstrap 43e7fb751c3d48366505:686)
    at ./app/app.js (bootstrap 43e7fb751c3d48366505:781)

但是当我设置target: 'web'时，它对fs或path等节点模块非常期待。

那么，我做错了什么？

/**
 * COMMON WEBPACK CONFIGURATION
 */

const path = require('path');
const webpack = require('webpack');

module.exports = (options) => ({
  node: {
    fs: 'empty'
  },
  entry: options.entry,
  output: Object.assign({ // Compile into js/build.js
    path: path.resolve(process.cwd(), 'build'),
    publicPath: '',
  }, options.output), // Merge with env dependent settings
  module: {
    loaders: [{
      test: /\.js$/, // Transform all .js files required somewhere with Babel
      loader: 'babel-loader',
      exclude: /node_modules/,
      query: options.babelQuery,
    }, {
      // Do not transform vendor's CSS with CSS-modules
      // The point is that they remain in global scope.
      // Since we require these CSS files in our JS or CSS files,
      // they will be a part of our compilation either way.
      // So, no need for ExtractTextPlugin here.
      test: /\.css$/,
      include: /node_modules/,
      loaders: ['style-loader', 'css-loader'],
    }, {
      test: /\.scss$/,
      use: [
        'style-loader',
        'css-loader?importLoaders=1&modules&localIdentName=[path]___[name]__[local]___[hash:base64:5]',
        'sass-loader'
      ]
    }, {
      test: /\.less$/,
      use: [
        'style-loader',
        'css-loader',
        'less-loader'
      ]
    }, {
      test: /\.(eot|svg|ttf|woff|woff2)$/,
      loader: 'file-loader',
    }, {
      test: /\.(jpg|png|gif)$/,
      loaders: [
        'file-loader',
        {
          loader: 'image-webpack-loader',
          query: {
            progressive: true,
            optimizationLevel: 7,
            interlaced: false,
            pngquant: {
              quality: '65-90',
              speed: 4,
            },
          },
        },
      ],
    }, {
      test: /\.html$/,
      loader: 'html-loader',
    }, {
      test: /\.json$/,
      loader: 'json-loader',
    }, {
      test: /\.(mp4|webm)$/,
      loader: 'url-loader',
      query: {
        limit: 10000,
      },
    }],
  },
  plugins: options.plugins.concat([
    new webpack.ProvidePlugin({
      // make fetch available
      fetch: 'exports-loader?self.fetch!whatwg-fetch',
    }),

    // Always expose NODE_ENV to webpack, in order to use `process.env.NODE_ENV`
    // inside your code for any environment checks; UglifyJS will automatically
    // drop any unreachable code.
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(process.env.NODE_ENV),
      },
    }),
    new webpack.NamedModulesPlugin(),
  ]),
  resolve: {
    modules: ['app', 'node_modules'],
    alias: { moment: 'moment/moment.js' },
    extensions: [
      '.js',
      '.jsx',
      '.react.js',
    ],
    mainFields: [
      'browser',
      'main',
      'jsnext:main',
    ],
  },
  devtool: options.devtool,
  target: 'node-webkit', // Make web variables accessible to webpack, e.g. window
  performance: options.performance || {},
});

Answer 1

好的，我知道为什么会发生。因为我是通过Chrome调用的。但是由于chrome没有Node.js引擎，因此出现了此错误。

在这里，我正在写如何使用nw.js或电子。

1-更改Web-> webpack.base.babel.js中的node-webkit 2- npm运行build：dll && npm start 3-在macOS上，我使用此命令运行nw-js

if(in_array($totalgrid, $ForbiddenGrids))
{
    echo '<script>alert("You can not sail to this direction");</script>';
} else {
    $query = "UPDATE playerships SET HGRID1 = '$mainhgrid', HGRID2 = '$varhgrid' WHERE ID='$shipid'";
}

这里详细介绍了如何运行nw.js https://github.com/nwjs/nw.js/wiki/how-to-run-apps。

Webpack配置目标：“node-webkit”因未捕获的ReferenceError而失败：未定义require

1 个答案: