This project was bootstrapped with Create React App.
In the project directory, you can run:
Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.
The page will reload when you make changes.
You may also see any lint errors in the console.
Generates two file index.js and index.css in the output directory.
Add the below script in package.json
"build:widget": "parcel build src/index.js --no-source-maps --dist-dir output"Update the root element in the public/index.html
<div id="js_widget__root__"></div>Add the following content in the root page of your web page.
<link href="output/index.css" rel="stylesheet" />
<script src="output/index.js"></script>OR
Build CDN to integrate with web pages
<link href="https://cdn.jsdelivr.net/gh/RamMohan222/web-widget-metrics-info/output/index.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/gh/RamMohan222/web-widget-metrics-info/output/index.js"></script>CDN with perticular version
<link href="https://cdn.jsdelivr.net/gh/RamMohan222/web-widget-metrics-info@v1.0.5/output/index.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/gh/RamMohan222/web-widget-metrics-info@v1.0.5/output/index.js"></script>Download a test.html and open in the browser and check the widget.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<h3>Widget Demo from CDN</h3>
<link href="https://cdn.jsdelivr.net/gh/RamMohan222/web-widget-metrics-info@v1.0.5/output/index.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/gh/RamMohan222/web-widget-metrics-info@v1.0.5/output/index.js"></script>
</body>
</html>