目录结构使用在根目录下输入yarn,可以看到生成node_modules目录。在根目录下输入yarn run build,可以看到生成dist/bundle.js,这个就是打包输出的内容。在根目录下输入yarn run dev,在浏览器输入http://localhost:8080/,可以看到控制台输出结果3.文件解析package.json{ “scripts”: { “dev”: “webpack-dev-server –mode development webpack.config.js”, “build”: “webpack –mode production –config webpack.config.js” }, “devDependencies”: { “webpack”: “^4.16.1”, “webpack-cli”: “^3.1.0”, “webpack-dev-server”: “^3.1.4” }}scripts下的是命令行可以输入的指令,比如yarn run dev执行的就是第一条;devDependencies是命令行输入yarn时安装的包。index.html<html> <head>Test Webpack Js</head> <meta charset=“UTF-8”> <body> <script src="./dist/bundle.js"></script> </body></html>可以看到引用的是打包后的js文件,bundle.jsapp.js// es6import sum from “./vendor/sum”;console.log(“sum(1, 2) = “, sum(1, 2));// commonJsvar sum1 = require(”./vendor/sum1”);console.log(“sum1(2, 3) = “, sum1(2, 3));package.json中两条命令打包的入口就是app.js,他引用的是要合并的两个js文件vendor/sum.js// es6export default function (a, b) { return a + b;}vendor/sum1.js// commonJsmodule.exports = function(a, b) { return a + b;};参考链接