hifipay-sdk-test-v25 v1.0.2
test-button
how to install, import and use npm package in our application (ex: hifipay-sdk-test) here we are taking example npm package(hifipay-sdk-test) for understanding.
for using npm package(hifipay-sdk-test) in our application, follow below step by step process
step 1:- install npm package(hifipay-sdk-test) in your application using below command:
command : npm install hifipay-sdk-test after installation process completed, we can see the package as dependency in package.json file
step2:- after that we can import the package any file in our application like below:
example: import {HifiPayBtn,HifiReButton} from 'hifipay-sdk-test' above there are two components extracted from the package(hifipay-sdk-test). we can import any one component or both as per our requirement.
step 3:- after importing we can use those components in our application.
before usage we need to aware about the props that we can passing externally in the component. for example in our case there are two components(HifiPayBtn and HifiReButton)
props for HifiPayBtn => (bWidth, bHeight) for setting height and width of the button (iWidth, iHeight) for setting height and width of the iFrame
working: if you click on HifiPayBtn. it shows iFrame. this button has toggle functinality
props for HifiReButton => (bWidth, bHeight) for setting height and width of the button working: if you click on HifiReButton, it redirects the landing page opened in a new tab
step 4:- let's understand the usage of the imported components with example code
// app.js file
import React from 'react';
import {HifiPayBtn,HifiReButton} from 'hifipay-sdk-test' ;
const App = ()=>{
return(
<div>
<h1>usage of imported npm package components</h1>
<HifiPayBtn bWidth={'200px'} bHeight={'50px'} iWidth={'500px'} iHeight={'600px'} />
<HifiReButton bWidth={'200px'} bHeight={'50px'} />
</div>
)
}
export default App;
11 months ago