bundle your assets scripts
assets scripts
Install Webpack
npminstall --save-dev webpack webpack-cliWrite Your Code
src/index.js
import bar from"./bar.js";bar();src/bar.js
exportdefaultfunctionbar(){//}Bundle It
Start without a configuration file, or provide a custom webpack.config.js:
import path from"node:path";import{ fileURLToPath }from"node:url";const __filename =fileURLToPath(import.meta.url);const __dirname = path.dirname(__filename);exportdefault{entry:"./src/index.js",output:{path: path.resolve(__dirname,"dist"),filename:"bundle.js",},};Prefer a video walkthrough? Without config
page.html
<!DOCTYPEhtml><html><head><metacharset="utf-8"/>
...
</head><body>
...
<scriptsrc="dist/bundle.js"></script></body></html>Then run webpack on the command-line to create bundle.js.
Awesome, isn't it? Let's dive in!
Get Started quickly in our Guides section, or dig into the Concepts section for more high-level information on the core notions behind webpack.
Support the Team
Through contributions, donations, and sponsorship, you allow webpack to thrive. Your donations directly support office hours, continued enhancements, and most importantly, great documentation and learning material!