table of Contents
1. Use npm in nodejs to download webpack
npm install [email protected] -g
After the download is complete, you can check the version
2. Case
mathUtils.js export module
function add(arg1, arg2) {
return arg1 + arg2;
}
function sub(arg1, arg2) {
return arg1 - arg2;
}
export {
add,sub
}
main.js import module
import {
add,sub} from './mathUtils.js'
console.log(add(10,20));
console.log(sub(50,20));
Wrong package when using main.js directly
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<script src="./src/main.js"></script>
<body>
</body>
</html>
Use webpack to solve
Type in the console
webpack .\src\main.js .\dist\bundle.js
Then modify the src directory file
<script src="./dist/bundle.js"></script>
In the preliminary test, you can add type ='module' to the script to test, and then use webpack to package and publish it on the server when publishing