Creating a Bundle

2026-02-07 11:53:43 -06:00
parent fdee96cc2c
commit 8bbddd6680
5 changed files with 18 additions and 16 deletions
--- a/webpack-demo/.gitignore
+++ b/webpack-demo/.gitignore
@@ -1 +1,2 @@
 node_modules/
+dist/
--- a/webpack-demo/index.html
+++ b/webpack-demo/index.html
@@ -1,14 +0,0 @@
-<!doctype html>
-<html>
-
-<head>
-  <meta charset="utf-8" />
-  <title>Getting Started</title>
-  <script src="https://unpkg.com/lodash@4.17.20"></script>
-</head>
-
-<body>
-  <script src="./src/index.js"></script>
-</body>
-
-</html>
--- a/webpack-demo/package-lock.json
+++ b/webpack-demo/package-lock.json
@@ -7,7 +7,10 @@
    "": {
      "name": "learning-webpack",
      "version": "1.0.0",
-      "license": "ISC",
+      "license": "MIT",
+      "dependencies": {
+        "lodash": "^4.17.23"
+      },
      "devDependencies": {
        "webpack": "^5.105.0",
        "webpack-cli": "^6.0.1"
@@ -899,6 +902,12 @@
        "node": ">=8"
      }
    },
+    "node_modules/lodash": {
+      "version": "4.17.23",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.23.tgz",
+      "integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==",
+      "license": "MIT"
+    },
    "node_modules/merge-stream": {
      "version": "2.0.0",
      "resolved": "https://registry.npmjs.org/merge-stream/-/merge-stream-2.0.0.tgz",
@@ -1419,6 +1428,7 @@
      "integrity": "sha512-MfwFQ6SfwinsUVi0rNJm7rHZ31GyTcpVE5pgVA3hwFRb7COD4TzjUUwhGWKfO50+xdc2MQPuEBBJoqIMGt3JDw==",
      "dev": true,
      "license": "MIT",
+      "peer": true,
      "dependencies": {
        "@discoveryjs/json-ext": "^0.6.1",
        "@webpack-cli/configtest": "^3.0.1",
--- a/webpack-demo/package.json
+++ b/webpack-demo/package.json
@@ -16,5 +16,8 @@
  "devDependencies": {
    "webpack": "^5.105.0",
    "webpack-cli": "^6.0.1"
+  },
+  "dependencies": {
+    "lodash": "^4.17.23"
  }
 }
--- a/webpack-demo/src/index.js
+++ b/webpack-demo/src/index.js
@@ -1,7 +1,9 @@
+import _ from "lodash";
+
 function component() {
  const element = document.createElement("div");

-  // Lodash, currently included via a script, is required for this line to work
+  // Lodash, now imported by this script
  element.innerHTML = _.join(["Hello", "webpack"], " ");

  return element;