Getting Started
To start building a new web component using Stencil, clone this repo to a new directory:
git clone https://github.com/clockhash-projects/hash-bot-fe.git hash-bot
cd hash-bot
git remote rm originand run:
npm install
npm startTo build the component for production, run:
npm run buildTo run the unit tests for the components, run:
npm test<script type="module" src="https://unpkg.com/hash-bot"></script>
<!--
To avoid unpkg.com redirects to the actual file, you can also directly import:
https://cdn.jsdelivr.net/npm/alpha-interface@1.0.2/dist/hash-bot/hash-bot.esm.js
-->
<hash-bot bot_name="ChatBot Test" agent_uuid="1b68cb7c-22e3-453c-9a38-xxxxxxxx" welcome_message="Hi! Ask me anything." iconsize="90" chatbotwidth="300" chatbotheight="400"></hash-bot>This will only load the necessary scripts needed to render <hash-bot/>. Once more components of this package are used, they will automatically be loaded lazily.
You can also import the script as part of your node_modules in your applications entry file:
import 'alpha-interface/dist/hash-bot/hash-bot.esm.js';Standalone
import 'alpha-interface';
function App() {
return (
<>
<div>
<hash-bot
bot_name="ChatBot Test"
agent_uuid="1b68cb7c-22e3-453c-9a38-xxxxxxxx"
welcome_message="Hi! Ask me anything."
iconsize="90"
chatbotwidth="300"
chatbotheight="400">
</hash-bot>
</div>
</>
);
}
export default App;