This plugin can be used to get a preview of the components.
Component Preview plugin is used to view the actual component through a custom field in strapi. This plugin helps to give a live preview the component we are using. That helps to easily understand the component using.
The plugin can be used in strapi version above 4.4 (versions that support custom fields).
npm i strapi-plugin-component-preview
Inorder to achieve the url of the file uploading it must be specified in the .env file as FILE_UPLOAD_URL. This url need to be the base url of the admin.
FILE_UPLOAD_URL="YOUR_BASE_URL_HERE"
.env file of your project.webpack.config.js
in src/admin
Add this to created file
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
// ./src/admin/webpack.config.js
'use strict';
/* eslint-disable no-unused-vars */
module.exports = (config, webpack) => {
// Note: we provide webpack above so you should not `require` it
// Perform customizations to webpack config
// Important: return the modified config
config.plugins.push(
new webpack.DefinePlugin({
FILE_UPLOAD_URL: JSON.stringify(process.env.FILE_UPLOAD_URL),
})
)
return config;
};
This file and code is added to access the FILE_UPLOAD_URL in the plugin.
NOTE: The images will not be saved into the database with the components.
npm install strapi-plugin-component-preview
Check out the available plugin resources that will help you to develop your plugin or provider and get it listed on the marketplace.