@abhisek507/react-core-web-element v0.0.2

Easily publish your React.js components on NPM step by step.

Installation

Install npm globally (ignore if already installed):

npm i -g npm

Install the @abhisek507/react-core-web-element library:

npm i @abhisek507/[email protected]

Usage

In React.js/Next.js/Vanilla JavaScript:

import { CoreWebElement } from '@abhisek507/react-core-web-element';

Render the JSX/HTML template:

const elementConfig = {
  header: {
    visible: true,
    heading: 'Header',
  },
  nav: {
    visible: true,
    title: 'Nav',
  },
  content: {
    visible: true,
    title: 'Content',
  },
  sidebar: {
    visible: true,
    title: 'Sidebar',
  },
};

function App() {
  return (
    <CoreWebElement {...elementConfig} />
  );
}

export default App;

We need few css variables. The values can be changed & based on the project requirements.

:root {
  --primary: #005f5a;
  --secondary: #14b8a6;
  --tertiary: #a7f3d0;
  --error: #ef4444;
  --warning: #f59e0b;
  --success: #16a34a;
  --white: #ffffff;
  --black: #000000;
  --grey: #e7e5e4;
}

Publish

Let's generate the build file,

npm run rollup

Increase the version count,

• package.json
• package-lock.json
• README.md

You must be logged in on npm. Then run,

npm publish --access private

If publishing public plugins use,

npm publish --access public