A collection of shared components, mixins, and scss variables to be used across the TF sites.
- Utilities/helpers can be included in two places; lib.js and shared.js.
- Shared.js makes things a part of the Vue instance, either components or, in the case of utils/helpers, exposed through $TF.
- Additional imports + exports in lib.js supply the functionality that allows an import from vanilla JS with a
import { Foo } from 'watchtower-benefits-shared-components'
npm install watchtower-shared-components
In your main vue file:
import Watchtower from 'watchtower-benefits-shared-components'
import 'watchtower-benefits-shared-components/lib/watchtower-benefits-shared-components.css'
Vue.use(Watchtower)
- On initial setup, add the following entry to your
hosts
file (mac:/etc/hosts
):127.0.0.1 components-dev.threeflow.com
- On first load, run
npm install
in terminal to get everything installed. - Run
npm run serve
in terminal to start the local server. You browser will open to https://components-dev.threeflow.com:8085/ automatically.
- On the application level (admin, broker, carrier), delete the "node_modules/.vite/deps" folder (
rm -rf ./node_modules/.vite/deps/watchtower-benefits-shared-components.*
) - On the shared repo, copy to applications (
npm run copy
) - On the application level, start the server (
npm run dev
)
Terminal Command | Description |
---|---|
npm run serve |
serve with hot reload at localhost:8085 (our example site). This will spin up a dev server with examples, the source code is located in /example/src. |
npm run serve-build |
serve with rollup watch/hot reload. this will spin up rollup, which will watch all the library components, and a vue-cli-service serve instance that will be restarted when rollup's watch detects changes. This way, you can test components in the same way that it will be used in in the other TF sites. |
npm run build |
build for production with minification (to push out to our example site) |
npm run unit |
run unit tests |
npm run lib |
build a package to publish |
npm publish |
Publish |
When merging into the main
, CircleCI and the threeflow-orb will:
- Automatically update the package version one minor version,
- Create a new github release,
- Publish new version to the npm registry.