Node.js 网页包错误-can'；t在'中解析加载程序；tmp/build…&x27；_Node.js_Reactjs_Webpack

Node.js 网页包错误-can'；t在'中解析加载程序；tmp/build…&x27；

node.js reactjs webpack

Node.js 网页包错误-can'；t在'中解析加载程序；tmp/build…&x27；,node.js,reactjs,webpack,Node.js,Reactjs,Webpack,我最近将eslint和eslint加载器NPM模块作为开发依赖项添加到我的React应用程序（带有网页包）-当我在本地运行我的开发服务器时，一切都很好。但是，当我尝试在本地构建生产版本时，它失败了，出现以下错误： npm ERR! Darwin 16.7.0 npm ERR! argv "/Users/user/.nvm/versions/node/v6.11.1/bin/node" "/Users/user/.nvm/versions/node/v6.11.1/bin/npm" "run" "

我最近将

eslint

和

eslint加载器

NPM模块作为开发依赖项添加到我的React应用程序（带有网页包）-当我在本地运行我的开发服务器时，一切都很好。但是，当我尝试在本地构建生产版本时，它失败了，出现以下错误：

npm ERR! Darwin 16.7.0
npm ERR! argv "/Users/user/.nvm/versions/node/v6.11.1/bin/node" "/Users/user/.nvm/versions/node/v6.11.1/bin/npm" "run" "build:client"
npm ERR! node v6.11.1
npm ERR! npm  v3.10.10
npm ERR! code ELIFECYCLE
npm ERR! App@0.0.1 build:client: `webpack`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the App@0.0.1 build:client script 'webpack'.

一时兴起，我还试着推到Heroku，在那里我得到了一个更有用的错误：

ERROR in Entry module not found: Error: Can't resolve 'eslint-loader' in '/tmp/build_5f502b6d28fee058cbe484b873b6e7cb'
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! App@0.0.1 build:client: `webpack`
npm ERR! Exit status 2

因此，在这一部分，我承认我对Webpack有点困惑，如果能提供一些指导和澄清，我将非常感激。我见过其他人有类似的问题，但从未提到过

'/tmp/build…“

首先，这里是我的

package.json中的脚本和一些其他相关内容：
"scripts": {
    "start": "if-env NODE_ENV=production && npm run start:prod || npm run start:dev",
    "start:prod": "node server.bundle.js",
    "start:dev": "concurrently --prefix \"[{name}]\" -k \"webpack -d --watch --colors\"  \"nodemon index.js\" -n \"WEBPACK,NODEMON\" --content-base public/",
    "build:client": "webpack",
    "build:server": "webpack --config webpack.server.config.js",
    "build": "NODE_ENV=production npm run build:client && npm run build:server",
    "postinstall": "npm run build"
},
"dependencies": {
    "webpack": "^2.6.0"
},
"devDependencies": {
    "eslint": "^4.4.1",
    "eslint-loader": "^1.9.0",
    "eslint-plugin-babel": "^4.1.2",
    "eslint-plugin-react": "^7.1.0"
    "webpack-dev-server": "^2.4.5"
}

正如错误所说，build:client
就是失败的地方
从webpack.config.js
：
"module": {
    "loaders": [
        {
            "exclude": /node_modules/,
            "loader": "babel-loader",
            "query": { "presets": ["react", "es2015", "stage-2"] },
            "test": /\.jsx?$/
        },
        {
            "exclude": /node_modules/,
            "loader": "babel-loader",
            "test": /\.js$/
        },
        {
            "enforce": "pre",
            "exclude": /node_modules/,
            "loader": "eslint-loader",
            "query": { "presets": ["react", "es2015", "stage-2"] },
            "test": /\.jsx$/
        },
        {
            "enforce": "pre",
            "exclude": /node_modules/,
            "loader": "eslint-loader",
            "test": /\.js$/
        }
    ]
}

const webpack = require("webpack")

module.exports = {
    "entry": "./src/index.jsx",
    "module": {
        "loaders": [
            {
                "exclude": /node_modules/,
                "loader": "babel-loader",
                "query": { "presets": ["react", "es2015", "stage-2"] },
                "test": /\.jsx?$/
            },
            {
                "exclude": /node_modules/,
                "loader": "babel-loader",
                "test": /\.js$/
            },
            {
                "enforce": "pre",
                "exclude": /node_modules/,
                "loader": "eslint-loader",
                "query": { "presets": ["react", "es2015", "stage-2"] },
                "test": /\.jsx$/
            },
            {
                "enforce": "pre",
                "exclude": /node_modules/,
                "loader": "eslint-loader",
                "test": /\.js$/
            }
        ]
    },
    "output": {
        "filename": "./public/bundle.js",
        "publicPath": "/"
    },
    "plugins": [
        new webpack.DefinePlugin({
            "API_URL": JSON.stringify(process.env.API_URL || "http://localhost:4000/api/v1"),
            "IS_STAGING": JSON.stringify(process.env.IS_STAGING || "false"),
            "NODE_ENV": JSON.stringify(process.env.NODE_ENV || "development")
        })
    ]
}

如果我在配置中注释掉引用eslint loader
的部分，那么它构建得很好，正如Heroku敏锐地观察到的那样，问题一定出在这些行上。有人能建议解决这个问题吗？我不确定自己是否真的理解出了什么问题，更不用说如何解决了
编辑这是我完整的webpack.config.js
：
"module": {
    "loaders": [
        {
            "exclude": /node_modules/,
            "loader": "babel-loader",
            "query": { "presets": ["react", "es2015", "stage-2"] },
            "test": /\.jsx?$/
        },
        {
            "exclude": /node_modules/,
            "loader": "babel-loader",
            "test": /\.js$/
        },
        {
            "enforce": "pre",
            "exclude": /node_modules/,
            "loader": "eslint-loader",
            "query": { "presets": ["react", "es2015", "stage-2"] },
            "test": /\.jsx$/
        },
        {
            "enforce": "pre",
            "exclude": /node_modules/,
            "loader": "eslint-loader",
            "test": /\.js$/
        }
    ]
}

const webpack = require("webpack")

module.exports = {
    "entry": "./src/index.jsx",
    "module": {
        "loaders": [
            {
                "exclude": /node_modules/,
                "loader": "babel-loader",
                "query": { "presets": ["react", "es2015", "stage-2"] },
                "test": /\.jsx?$/
            },
            {
                "exclude": /node_modules/,
                "loader": "babel-loader",
                "test": /\.js$/
            },
            {
                "enforce": "pre",
                "exclude": /node_modules/,
                "loader": "eslint-loader",
                "query": { "presets": ["react", "es2015", "stage-2"] },
                "test": /\.jsx$/
            },
            {
                "enforce": "pre",
                "exclude": /node_modules/,
                "loader": "eslint-loader",
                "test": /\.js$/
            }
        ]
    },
    "output": {
        "filename": "./public/bundle.js",
        "publicPath": "/"
    },
    "plugins": [
        new webpack.DefinePlugin({
            "API_URL": JSON.stringify(process.env.API_URL || "http://localhost:4000/api/v1"),
            "IS_STAGING": JSON.stringify(process.env.IS_STAGING || "false"),
            "NODE_ENV": JSON.stringify(process.env.NODE_ENV || "development")
        })
    ]
}

我认为您的问题可能是在devDependencies
中有EsLint。如果我没记错的话，Heroku只安装应用程序的依赖项。尝试将EsLint移动到依赖项中
我认为您的问题可能是在依赖项中有EsLint。如果我没记错的话，Heroku只安装应用程序的依赖项。尝试将EsLint移动到依赖项中
感谢@Marek和@arche0pteryx对此的想法-我想出了一个解决方案，尽管它可能不是最优的
基本上，我创建了一个webpack.dev.config.js
文件，其中包含对eslint加载程序的引用。。。这很好，因为我只想在本地开发中使用林亭。然后，我从更新的主配置文件package.json
中删除了这些引用，以便在本地开发中使用dev配置，这一切都很好。
感谢@Marek和@arche0pteryx对此的思考-我想出了一个修复方案，尽管它可能不是最优的
基本上，我创建了一个webpack.dev.config.js
文件，其中包含对eslint加载程序的引用。。。这很好，因为我只想在本地开发中使用林亭。然后我从我的主配置文件updatedpackage.json中删除了这些引用，以便在本地开发中使用dev-config，这一切都很好。
我也遇到了同样的问题，但对我来说，这并没有以这种方式解决
我用埃夫豪斯的答案解决了这个问题

这就是解决方案：
plugins: [
    require.resolve("babel-plugin-add-module-exports"),
    require.resolve("babel-plugin-transform-decorators-legacy")
],
presets: [
    require.resolve("babel-preset-es2015"),
    require.resolve("babel-preset-stage-0"),
    require.resolve("babel-preset-react")
]

我也有同样的问题，但对我来说，这并没有以这种方式解决
我用埃夫豪斯的答案解决了这个问题

这就是解决方案：
plugins: [
    require.resolve("babel-plugin-add-module-exports"),
    require.resolve("babel-plugin-transform-decorators-legacy")
],
presets: [
    require.resolve("babel-preset-es2015"),
    require.resolve("babel-preset-stage-0"),
    require.resolve("babel-preset-react")
]

我们需要你的webpack.server.config
oops。很抱歉我没有看到你的一些留言。坚持尝试：在您的包.json中添加“build:client”：“webpack--config webpack.config.js
@archae0pteryx我试过了，但仍然得到相同的错误…tmp文件夹存在吗？如果没有，就做一个。我可能是由于权限原因，它在创建文件夹时遇到问题？把它扔掉there@archae0pteryx很好的建议，但仍然是同样的问题。请发布您的整个网页包配置好吗？我们需要您的webpack.server.config
oops。很抱歉我没有看到你的一些留言。坚持尝试：在您的包.json中添加“build:client”：“webpack--config webpack.config.js
@archae0pteryx我试过了，但仍然得到相同的错误…tmp文件夹存在吗？如果没有，就做一个。我可能是由于权限原因，它在创建文件夹时遇到问题？把它扔掉there@archae0pteryx很好的建议，但还是一样的麻烦。请你发布你的整个网页配置好吗？谢谢Marek，这是一个很好的想法。。。但是它没有帮助，在本地和Heroku部署上仍然存在相同的问题：（谢谢Marek，这是一个好主意……但是它没有帮助，在本地和Heroku部署上仍然存在相同的问题：（f'n'a mang.+1抱歉，我们无法找出“正确的”解决方案…但是嘿。有时候你只是需要破解！很高兴你得到了它。@Arche0pteryx非常感谢！f'n'a mang.+1很抱歉我们无法找到“正确”的解决方案…但是嘿。有时候你只是需要破解！很高兴你得到了它。@Arche0pteryx非常感谢！