Replacing Logo in v4

j_p · January 27, 2023, 2:38pm

For anyone else who has the same issue this is what actually worked for me:

github.com/strapi/strapi

Admin Menu Logo customization error

opened 07:52AM - 15 Dec 21 UTC

closed 02:25PM - 29 Dec 21 UTC

mistrypavan

issue: bug source: core:admin status: pending reproduction

# Admin Customization Error ## Build always failed, after changes made in .sr…c/admin/app.js I am customizing the Admin Panel but its took me more than 8 hours and error is same in all case. ### Error in WEB browser ``` Compiled with problems:X ERROR in ./.cache/admin/src/app.js 10:35-67 Module not found: Error: Can't resolve './extensions/Logo.png' in 'D:\POC\stp4prj1\.cache\admin\src' ``` ### Error in console ``` runtime modules 31 KiB 17 modules ./.cache/admin/src/app.js 509 bytes [built] [code generated] ERROR in ./.cache/admin/src/app.js 10:35-67 Module not found: Error: Can't resolve './extensions/Logo.png' in 'D:\POC\stp4prj1\.cache\admin\src' resolve './extensions/Logo.png' in 'D:\POC\stp4prj1\.cache\admin\src' using description file: D:\POC\stp4prj1\.cache\package.json (relative path: ./admin/src) Field 'browser' doesn't contain a valid alias configuration using description file: D:\POC\stp4prj1\.cache\package.json (relative path: ./admin/src/extensions/Logo.png) no extension Field 'browser' doesn't contain a valid alias configuration D:\POC\stp4prj1\.cache\admin\src\extensions\Logo.png doesn't exist .js Field 'browser' doesn't contain a valid alias configuration D:\POC\stp4prj1\.cache\admin\src\extensions\Logo.png.js doesn't exist .jsx Field 'browser' doesn't contain a valid alias configuration D:\POC\stp4prj1\.cache\admin\src\extensions\Logo.png.jsx doesn't exist .react.js Field 'browser' doesn't contain a valid alias configuration D:\POC\stp4prj1\.cache\admin\src\extensions\Logo.png.react.js doesn't exist as directory D:\POC\stp4prj1\.cache\admin\src\extensions\Logo.png doesn't exist @ ./.cache/admin/src/index.js 17:34-50 webpack 5.36.2 compiled with 1 error in 1581 ms ``` ### Steps to reproduce the behavior 1. Add CustomLogo.png in ./src/admin/extensions/ folder 2. Go to './src/admin/app.js' add followings ``` import MenuLogo from './extensions/logo.png'; import favicon from './extensions/favicon.ico'; export default { config: { // Replace the Strapi logo in auth (login) views auth: { logo: AuthLogo, }, head: { favicon: favicon, }, }, bootstrap() {}, }; ``` 3. run ``` yarn develop --watch-admin ``` I have ran ``` yarn build ``` In both cases error was the same ### As per documentation this should have worked It should have changed the logo and favicon ### Screenshots ![image](https://user-images.githubusercontent.com/38503286/146145216-fee3cb9c-58cf-4ce5-9313-b65a9bb28a3e.png) ### Code snippets If applicable, add code samples to help explain your problem. ### System - Node.js version: Node LTS version v16 - NPM version: 8.1 - Strapi version: v4 - Database: Postgres 14 - Operating system: Win 11