TypeError：无法读取 hjs-webpack 中未定义的属性“推送”答案

【问题标题】：TypeError: Cannot read property 'push' of undefined in hjs-webpackTypeError：无法读取 hjs-webpack 中未定义的属性“推送”
【发布时间】：2019-07-04 08:22:17
【问题描述】：

以下来自Fullstack.io: create yelp clone的教程

在我的 webpack.config.js 文件中：

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


join = path.join,
resolve = path.resolve;


const root = resolve(__dirname);
const src = join(root, 'src');
const modules = join(root, 'node_modules');
const dest = join(root, 'dist');

const NODE_ENV = process.env.NODE_ENV;
const isDev = NODE_ENV === 'development';

const getConfig = require('hjs-webpack');
var config = getConfig({
    isDev: isDev,
    in: join(src, 'app.js'),// entry point file
    out: dest,
    // blow away any previously built files before it starts building new ones
    clearBeforeBuild: true
    });


config.module.loaders.push({
    test: /\.css$/,
    include: [modules],
    loader: 'style!css'
  })


module.exports = config;

在运行开发时。服务我收到以下错误：

TypeError: Cannot read property 'push' of undefined
    at Object.<anonymous> (E:\projects\React\yelpReact\webpack.config.js:90:22)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (E:\projects\React\yelpReact\node_modules\hjs-webpack\bin\hjs-dev-server.js:17:12)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)
    at Function.Module.runMain (module.js:605:10)
    at startup (bootstrap_node.js:158:16)
Failed to load webpack config, please use like this
hjs-dev-server.js webpack.config.js

原来 config.module.loaders 正在返回 null，我到底做错了什么，我从未使用过“hjs-webpack”，感谢任何帮助

【问题讨论】：

检查config.module，然后再尝试访问.loaders 以将某些内容推入其中。看起来只是一个配置问题。
我这样做了，正如我在代码下方的评论中提到的那样，console.log on (config.module.loaders) 并且它总是返回 undefined，唯一返回对象数组的属性是 (config.模块规则）

标签： javascript reactjs web webpack

【解决方案1】：

Cannot read property 'push' of undefined 表明 config.module.loaders 未定义。

这是一个 webpack 配置，在 webpack 配置中，加载器位于 module.rules 和 module.loaders 我认为无法识别（并且因此getConfig 可能不会返回）。

我建议您尝试将modules 替换为rules，如下所示：

    config.module.rules.push({
        test: /\.css$/,
        include: [modules],
        loader: 'style!css'
    });

Resource on webpack configuration

【讨论】：

这行得通，谢谢。问题是教程最后一次更新是在 3 年前我在其他部分遇到错误
hjs-webpack 并没有做太多的事情，通过密切关注 webpack 配置，您应该能够完成教程。或者完全放弃 hjs-webpack，因为从头开始配置 webpack 4 非常容易，你会在社区中找到很多关于该主题的信息

【解决方案2】：

WP 加载器位于 rules 子数组中。

另外 - 对 hjs-webpack 中的导出的快速检查表明，module 对象上确实没有 loaders 属性。

因此 - 您应该按如下方式更新您的代码：

config.module.loaders.push({
test: /\.css$/,
include: [modules],
loader: 'style!css'})

hjs-webpack/blob/master/index.js#L158

WP Config specs

【讨论】：