webpack terminal command results in /config/webpack/development.js not found - node.js

Question

When I enter $ webpack into my terminal I receive the following error:
webpack config
/Users/kristenmkulha/Desktop/react-help-queue/config/webpack/development.js
not found, please run 'bundle exec rails webpacker:install' to install
Webpacker with default configs or add the missing config file for your
custom environment.
I found a similar issue here: Webpack command in node brings /config/webpack/development.js not found and changed the deprecated babel-preset-es2015 to babel-preset-env and I already had the -loader suffix. These updates still result in the same error.
Here is my webpack.config.js:
const webpack = require('webpack');
const { resolve } = require('path');
module.exports = {
entry: [
resolve(__dirname, "src") + "/index.jsx"
],
output: {
filename: 'app.bundle.js',
path: resolve(__dirname, 'build')
},
resolve: {
extensions: ['.js', '.jsx']
},
module: {
rules: [
{
test: /\.jsx?$/,
loader: "babel-loader",
options: {
presets: [
"env",
"react"
]
}
},
],
}
};
Here is my package.json file:
{
"name": "react-help-queue",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"react": "^15.5.4",
"react-dom": "^15.5.4"
},
"devDependencies": {
"babel-core": "^6.24.1",
"babel-loader": "^7.0.0",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"webpack": "^3.8.1"
}
}

Answer 1

Huh, it looks like running "webpack" on the command line is invoking a different tool (maybe "webpacker"? https://github.com/rails/webpacker)
There are two ways to solve this:
add a additional script to package.json to kick off webpack.
"scripts": {
"build": "webpack -p"
},
With the above added, execute this command in a terminal: npm run build.
When a script is executed via npm run, npm will automatically include binaries (like webpack) in its PATH, so it the script uses the webpack binary that is part of the apps dev dependencies. Read more on this here: https://docs.npmjs.com/cli/run-script.
Install webpack globally: npm install -g webpack.
This will make webpack available at the command line in all cases, which allows the developer to just type webpack and have it run. This should(?) override the existing "webpacker" command. If not, you may need to uninstall that tool or modify your PATH.
Installing npm packages globally is convienient but it can cause headaches. For example, if two different projects need two different versions of webpack, it may not be efficient. Also, you may find there are several steps in a "build" to execute once an application gets more complex, so having a convenient script included in the project may be appealing (especially for projects with multiple developers).
Hope this helps!