product-search v1.0.2

product-search-widget

A web component designed to be embedded in any site, linking a user to the Visit Scotland DMS.

Project structure

The two root folders are intended to run seperately. The 'product-search-widget' folder contains the main widget code in a Vue 3 application and the 'external-site' folder contains an index page designed to test the use of the Product Search widget as an embedded Web Component.

Running the Product Search Widget

In the product-search-widget folder:

yarn dev

Building the Product Search Widget

In the product-search-widget folder:

yarn build

Running an external site

The external site will pull in the latest build from the product-search-widget folder. In the external-site folder:

yarn serve

Publish to NPM

Increment the version number in package.json

npm version patch

Push the compiled web component to the NPM repo (requires authorised NPM account to work)

npm publish

The npm package can be found here: https://www.npmjs.com/package/@visitscotland/product-search

Further information

More information on the Vue 3 build can be found in the README.md file within the product-search-widget folder.