This project contains Vue UI components for Nuskin product display.
Before installing @nuskin/product-components
, you will have to add its peer dependencies and set up the run config.
See src/package.json
and find the "peerDependencies"
section for most-accurate information.
npm i @nuskin/ns-account@4
npm i @nuskin/ns-checkout-common@3
npm i @nuskin/ns-product@3
npm i @nuskin/ns-shop@3
npm i @nuskin/ns-util@3
npm i @nuskin/ns-feature-flags@1
or
npm i @nuskin/ns-account@4 @nuskin/ns-checkout-common@3 @nuskin/ns-product@3 @nuskin/ns-shop@3 @nuskin/ns-util@3 @nuskin/ns-feature-flags@1
yarn add @nuskin/ns-account@4
yarn add @nuskin/ns-checkout-common@3
yarn add @nuskin/ns-product@3
yarn add @nuskin/ns-shop@3
yarn add @nuskin/ns-util@3
yarn add @nuskin/ns-feature-flags@1
or
yarn add @nuskin/ns-account@4 @nuskin/ns-checkout-common@3 @nuskin/ns-product@3 @nuskin/ns-shop@3 @nuskin/ns-util@3 @nuskin/ns-feature-flags@1
This package uses services and events from external libraries that require a run config to be initialized when the app is first loaded.
import { RunConfigService } from "@nuskin/ns-util";
// ...
// WARNING: these should come from app/user configuration
const countryCode = "US";
const language = "en";
const baseUrl = "https://test.nuskin.com";
// Initialize run config
let runConfig = RunConfigService.getRunConfig();
if (!runConfig || !runConfig.baseUrl) {
runConfig = {
country: countryCode,
language: language,
baseUrl: baseUrl
};
RunConfigService.setRunConfig(runConfig);
}
// ...
npm i @nuskin/product-components
yarn add @nuskin/product-components
<template>
<!-- ... -->
<NsProductCard sku="01550004" />
<!-- ... -->
</template>
<script>
import { NsProductCard } from "@nuskin/product-components";
export default {
//...
components: {
// ...
NsProductCard
},
//...
}
</script>