can any one help on creating a plugin to do this… am new to strapi so just trying to learn about the plugins structures and logic
How does one accomplish this in v4?
patch-package would be the only way to do this in v4
With v4 for my use case I did the following dev process:
- I placed home page folder under extensions:
src/extensions/admin/pages/homepage/index.js - created patch-admin.js under extensions folder with:
the following logic >
const fs = require(‘fs’);
fs.cp(‘src/extensions/admin’, ‘node_modules/@strapi/admin/admin/src’, { recursive: true }, (err) => {
if (err) {
console.error(err);
}
}); - Add the following to package.json under scripts:
“patch-admin” : “node src/extensions/patch-admin.js && patch-package @strapi/admin” - Make mods and run patch-admin, then develop-watch(strapi develop --watch-admin) to confirm and test changes.
Not ideal but still manageable. We are using dev containers, so I will add some automation within that so rest of team is in synch as well. Free time I am playing with the admin injection and blocks to see if I can share a proposal with working POC.
Could you provide an example? After following the instructions provided by patch-package, whenever I’ve tried to do it, I keep getting this message. The specific part of the admin panel I am trying to edit is the LeftMenu component:
$ npx patch-package @strapi/strapi
patch-package 6.4.7
• Creating temporary folder
• Installing @strapi/strapi@4.3.2 with yarn
• Diffing your files with clean files
⁉️ Not creating patch file for package '@strapi/strapi'
⁉️ There don't appear to be any changes.
shoud we customize in typescript?not in javascript
Yeah thanks, it was yarn patch-package @strapi/admin that actually worked fro me.
bro you find any ans??? how to customize in typescript
Still no way to perform a welcome page customization in V4 ?
Here is my current setup using patch-package, not ideal but its the only way I can find to currently do it.
Setup
- install patch-package via
npm i patch-package - install @strapi/admin if not already included in your package.json via
npm i @strapi/admin - add the following scripts to package.json:
"generate-admin-patches": "npx patch-package@strapi/admin""apply-admin-patches": "npx patch-package"
Usage
- Make changes to relevant files, likely found in
/node_modules/@strapi/admin/admin/src/pages - Save changes via
npm run generate-admin-patches - We can then apply these patches, for example if we update strapi or when packages are initially installed packages, by running
npm run apply-admin-patches
1 Like
According to the Strapi team, there used to be an extensions feature but they got rid of it cause it kept causing a lot of bugs and they advice using patch-package.
Here’s a simple example of how to achieve this.
First install patch-package and postinstall using one of the following commands
yarn add patch-package postinstall-postinstall
or
npm i patch-package postinstall-postinstall
you can add a ‘–dev’ flag if you don’t wanna use it in production
add the following command to your scripts in your ‘package.json’ file
"scripts":{
//..
+ "postinstall": "patch-package"
//..
}
next go into the node_modules folder and find the @strapi directory in which you’ll find the different components available by default.
A sample change like in my case was changing the content in the Homepage which I was able to find in the @strapi/admin/admin/src/pages/HomePage directory.
After making changes to the index.js file for example, head to your terminal and run yarn patch-package @strapi/admin.
This will create a patch folder in the root directory of your project with the changes made. Once the operation is done running, run yarn build and then yarn develop and your changes should be properly reflected. Not the most convenient of methods and that’s understandable but it’s the most effective method i could find online right now. I encourage you to read the patch-package docs for more info on how to use it. Good luck
2 Likes