From d8beede4208b6244a670c209cb0914f43c33636a Mon Sep 17 00:00:00 2001
From: Frank Delaguila <frankdelaguila@Franks-MacBook-Pro.local>
Date: Sat, 12 Mar 2022 18:55:57 -0700
Subject: [PATCH] Adding in fixes for Webpack build

---
 package.json           |  3 +++
 src/components/App.jsx | 17 +++++++++++------
 webpack.prod.js        |  2 +-
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/package.json b/package.json
index 4f437f7..b2b3a91 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
     "@babel/preset-react": "^7.16.7",
     "babel-loader": "^8.2.3",
     "clean-webpack-plugin": "^4.0.0",
+    "css-loader": "^6.7.1",
     "css-minimizer-webpack-plugin": "^3.4.1",
     "express": "^4.17.3",
     "html-critical-webpack-plugin": "^2.1.0",
@@ -24,6 +25,8 @@
     "html-webpack-plugin": "^5.5.0",
     "image-minimizer-webpack-plugin": "^3.2.3",
     "mini-css-extract-plugin": "^2.6.0",
+    "postcss-loader": "^6.2.1",
+    "resolve-url-loader": "^5.0.0",
     "sass": "^1.49.9",
     "sass-loader": "^12.6.0",
     "style-loader": "^3.3.1",
diff --git a/src/components/App.jsx b/src/components/App.jsx
index c5d2f6b..667b754 100644
--- a/src/components/App.jsx
+++ b/src/components/App.jsx
@@ -27,12 +27,17 @@ const Box = (props) => {
 
 const App = () => {
   return (
-    <Canvas>
-      <ambientLight />
-      <pointLight position={[10, 10, 10]} />
-      <Box position={[-1.2, 0, 0]} />
-      <Box position={[1.2, 0, 0]} />
-    </Canvas>
+    <>
+      <nav>
+        nav
+      </nav>
+      <Canvas>
+        <ambientLight />
+        <pointLight position={[10, 10, 10]} />
+        <Box position={[-1.2, 0, 0]} />
+        <Box position={[1.2, 0, 0]} />
+      </Canvas>
+    </>
   );
 };
 
diff --git a/webpack.prod.js b/webpack.prod.js
index 3e99312..629e821 100644
--- a/webpack.prod.js
+++ b/webpack.prod.js
@@ -10,7 +10,7 @@ const ImageMinimizerPlugin = require('image-minimizer-webpack-plugin');
 module.exports = merge(commonConfiguration, {
   mode: 'production',
   entry: {
-    popshop: path.resolve(__dirname, './src/scripts/app.js'),
+    portfolio: path.resolve(__dirname, './src/scripts/app.js'),
   },
   devtool: 'source-map',
   output: {