I've been following the introductory tutorial on webpack from this particular link: https://webpack.js.org/guides/getting-started/
However, when I attempt to execute npx webpack, it encounters an error as shown below:
ERROR in main.js from Terser
TypeError: Cannot read property 'minify' of undefined
at minify (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/terser-webpack-plugin/dist/minify.js:175:23)
at module.exports (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/terser-webpack-plugin/dist/worker.js:13:40)
at handle (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/worker-farm/lib/child/index.js:44:8)
at process.<anonymous> (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/worker-farm/lib/child/index.js:51:3)
at process.emit (events.js:188:13)
at emit (internal/child_process.js:828:12)
at process.internalTickCallback (internal/process/next_tick.js:72:19)
- Node Version: v11.6.0
- NPM Version: 6.5.0-next.0
- Webpack Version: 4.29.0
- Webpack-CLI Version: 3.2.1
Folder Structure
/dist
index.html
/node_modules
/src
index.js
package-lock.json
package.json
index.html
<!doctype html>
<html>
<head>
<title>Getting Started</title>
</head>
<body>
<script src="main.js"></script>
</body>
</html>
index.js
import _ from 'lodash';
function component() {
let element = document.createElement('div');
element.innerHTML = _.join(['hello', 'webpack'], ' ');
return element;
}
document.body.appendChild(component());
package.json
{
"name": "webpack-demo",
"version": "1.0.0",
"description": "",
"private": true,
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.29.0",
"webpack-cli": "^3.2.1"
},
"dependencies": {
"lodash": "^4.17.11"
}
}