Removed file-loader and utilised webpack5's asset modules on advice of …

…@bennettp123
sevenwestmedia · Jun 7, 2024 · 16795a8 · 16795a8
1 parent a401ca0
commit 16795a8
Show file tree

Hide file tree

Showing 4 changed files with 22 additions and 37 deletions.
diff --git a/package.json b/package.json
@@ -34,22 +34,22 @@
  "watch:bundle-splitting-example": "yarn pwt watch -p examples/bundle-splitting",
  "explore-bundle:bundle-splitting-example": "yarn pwt explore-bundle -p examples/bundle-splitting",
  "~~~ client-only ~~~": "",
- "build:client-only-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt build -p examples/client-only",
- "watch:client-only-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt watch -p examples/client-only",
- "debug:client-only-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt watch debug-brk -p examples/client-only",
- "explore-bundle:client-only-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt explore-bundle -p examples/client-only",
+ "build:client-only-example": "yarn pwt build -p examples/client-only",
+ "watch:client-only-example": "yarn pwt watch -p examples/client-only",
+ "debug:client-only-example": "yarn pwt watch debug-brk -p examples/client-only",
+ "explore-bundle:client-only-example": "yarn pwt explore-bundle -p examples/client-only",
  "~~~ with-server ~~~": "",
- "build:with-server-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt build -p examples/with-server",
- "watch:with-server-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt watch server -p examples/with-server",
- "explore-bundle:with-server-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt explore-bundle -p examples/with-server",
+ "build:with-server-example": "yarn pwt build -p examples/with-server",
+ "watch:with-server-example": "yarn pwt watch server -p examples/with-server",
+ "explore-bundle:with-server-example": "yarn pwt explore-bundle -p examples/with-server",
  "~~~ simple-ssr ~~~": "",
  "build:simple-ssr-example": "yarn pwt build -p examples/simple-ssr",
  "watch:simple-ssr-example": "yarn pwt watch server -p examples/simple-ssr",
  "explore-bundle:simple-ssr-example": "yarn pwt explore-bundle -p examples/simple-ssr",
  "~~~ ssr-with-routing ~~~": "",
- "build:ssr-with-routing-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt build -p examples/ssr-with-routing",
- "watch:ssr-with-routing-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt watch server -p examples/ssr-with-routing",
- "explore-bundle:ssr-with-routing-example": "export NODE_OPTIONS=--openssl-legacy-provider && yarn pwt explore-bundle -p examples/ssr-with-routing",
+ "build:ssr-with-routing-example": "yarn pwt build -p examples/ssr-with-routing",
+ "watch:ssr-with-routing-example": "yarn pwt watch server -p examples/ssr-with-routing",
+ "explore-bundle:ssr-with-routing-example": "yarn pwt explore-bundle -p examples/ssr-with-routing",
  "~~~ ssr-with-data-loading-using-redux ~~~": "",
  "build:ssr-with-data-loading-using-redux-example": "yarn pwt build -p examples/ssr-with-data-loading-using-redux",
  "watch:ssr-with-data-loading-using-redux-example": "yarn pwt watch server -p examples/ssr-with-data-loading-using-redux",

diff --git a/packages/cli/package.json b/packages/cli/package.json
@@ -23,7 +23,6 @@
  "babel-loader": "^8.1.0",
  "dotenv": "^8.2.0",
  "esbuild-loader": "^2.12.0",
- "file-loader": "^6.2.0",
  "html-webpack-plugin": "^5.6.0",
  "http-proxy-middleware": "^1.0.5",
  "md5": "^2.3.0",

diff --git a/packages/cli/src/config/webpack.base.ts b/packages/cli/src/config/webpack.base.ts
@@ -1,17 +1,6 @@
 import webpack from 'webpack'
-import { BuildConfig } from '@project-watchtower/server'
 import { CreateWebpackConfigOptions } from '.'
 
-export const fileLoaderConfig = (buildConfig: BuildConfig) => ({
- exclude: /\/favicon.ico$/,
- loader: 'file-loader',
- options: {
- name: buildConfig.ASSETS_PATH_PREFIX + 'media/[name].[hash:8].[ext]',
- esModule: false,
- },
- test: /\.(ico|jpg|png|gif|otf|webp|svg|ttf)(\?.*)?$/,
-})
-
 const plugins = [new webpack.NoEmitOnErrorsPlugin()]
 
 /**
@@ -24,14 +13,19 @@ export function baseConfig(options: CreateWebpackConfigOptions): webpack.Configu
  return {
  module: {
  rules: [
- fileLoaderConfig(options.buildConfig),
  {
- loader: 'file-loader',
- options: {
- name: options.buildConfig.ASSETS_PATH_PREFIX + 'fonts/[name].[ext]',
- esModule: false,
- },
+ test: /\.(ico|jpg|png|gif|otf|webp|svg|ttf)(\?.*)?$/,
+ type: 'asset/resource',
+ generator: {
+ filename: options.buildConfig.ASSETS_PATH_PREFIX + 'media/[name].[hash:8].[ext]'
+ }
+ },
+ {
  test: /\.(eot|woff|woff2)(\?.*)?$/,
+ type: 'asset/resource',
+ generator: {
+ filename: options.buildConfig.ASSETS_PATH_PREFIX + 'fonts/[name].[ext]',
+ },
  },
  ],
  },

diff --git a/yarn.lock b/yarn.lock
@@ -4459,14 +4459,6 @@ file-entry-cache@^6.0.1:
  dependencies:
  flat-cache "^3.0.4"
 
-file-loader@^6.2.0:
- version "6.2.0"
- resolved "https://registry.yarnpkg.com/file-loader/-/file-loader-6.2.0.tgz#baef7cf8e1840df325e4390b4484879480eebe4d"
- integrity sha512-qo3glqyTa61Ytg4u73GultjHGjdRyig3tG6lPtyX/jOEJvHif9uB0/OCI2Kif6ctF3caQTW2G5gym21oAsI4pw==
- dependencies:
- loader-utils "^2.0.0"
- schema-utils "^3.0.0"
-
 fill-range@^7.0.1:
  version "7.0.1"
  resolved "https://registry.yarnpkg.com/fill-range/-/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
@@ -8260,7 +8252,7 @@ schema-utils@^2.6.5, schema-utils@^2.7.1:
  ajv "^6.12.4"
  ajv-keywords "^3.5.2"
 
-schema-utils@^3.0.0, schema-utils@^3.1.1, schema-utils@^3.2.0:
+schema-utils@^3.1.1, schema-utils@^3.2.0:
  version "3.3.0"
  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-3.3.0.tgz#f50a88877c3c01652a15b622ae9e9795df7a60fe"
  integrity sha512-pN/yOAvcC+5rQ5nERGuwrjLlYvLTbCibnZ1I7B1LaiAz9BRBlE9GMgE/eqV30P7aJQUf7Ddimy/RsbYO/GrVGg==