@solfacil/store-tools-financing v0.18.0
Store Tools Financing
Componente para vendas de Kits Solares que será incorporado em projetos Solfácil.
Pré-requisitos
Antes de começar, certifique-se de ter instalado o Node.js e o Yarn em sua máquina.
Instalação
Clone o repositório do projeto:
git clone https://github.com/seu-usuario/seu-projeto.git
Na pasta do projeto execute a instalação:
yarn install
Ambiente de desenvolvimento
Para que os kits sejam exibidos em ambiente de desenvolvimento é necessario que no arquivo apollo.ts
o useCookie
esteja comentado
// import { useCookie } from './cookies'
// const access_token = useCookie<string>().get('access_token')
e a constante access_token
receba um token que está autenticado em https://stg-loja.solfacil.com.br/
const access_token = 'token_de_autenticacao'
Instalação de um Pacote Localmente
A instalação local é útil quando você deseja testar um pacote ou módulo em desenvolvimento antes de publicá-lo no registro npm.
Passo a Passo
Passo 1: Compilar o Pacote
Antes de empacotar o pacote, é necessário compilá-lo para garantir que todas as dependências estejam corretamente resolvidas e que o código esteja pronto para uso. Para fazer isso, siga os passos abaixo:
yarn build:lib:ts
Passo 2: Empacotamento
Após a compilação do pacote, você pode empacotá-lo usando o Yarn. O empacotamento cria um arquivo .tgz contendo o pacote que pode ser instalado localmente em outros projetos. Execute o seguinte comando:
yarn pack
Este comando criará um arquivo .tgz
no diretório raiz do seu projeto. O nome do arquivo terá o formato nome-do-pacote-versao.tgz
, onde nome-do-pacote
é o nome do seu pacote e versao: X.X.X
é a versão atual do pacote.
Passo 3: Instalar Localmente
Agora que você criou o pacote com sucesso, você pode instalá-lo em outro projeto localmente usando o arquivo .tgz
que você criou. Vá para o diretório do projeto onde deseja instalar o pacote localmente e execute o seguinte comando:
yarn add file:/caminho/para/o/arquivo/nome-do-pacote-versao.tgz
Substitua /caminho/para/o/arquivo/nome-do-pacote-versao.tgz
pelo caminho completo para o arquivo .tgz que você criou no Passo 2.
Isso instalará o pacote localmente em seu projeto, e agora você pode usá-lo como qualquer outro pacote instalado via Yarn.
Passo 4: Integrar a Biblioteca "@solfacil/store-tools-financing" no Projeto
No arquivo package.json
do seu projeto, adicione a biblioteca "@solfacil/store-tools-financing"
como uma dependência. Certifique-se de usar a versão específica do pacote que você deseja. Você pode fazer isso da seguinte maneira:
"dependencies": {
"@solfacil/store-tools-financing": "./solfacil-store-tools-financing-v0.0.0.tgz"
}
Passo 5: Execute o comando de instalação
Use o gerenciador de pacotes para instalar a biblioteca e suas dependências executando o seguinte comando no terminal:
pnpm install
Passo 6: Crie um arquivo "store-tools-financing.ts"
Na pasta "modules" do seu projeto, crie um novo arquivo chamado "store-tools-financing.ts". Dentro deste arquivo, adicione o seguinte código:
import { install as StoreToolsFinancing } from '@solfacil/store-tools-financing'
import '@solfacil/store-tools-financing/dist/style.css'
import type { UseModule } from '~/types'
export const install: UseModule = ({ instance }) => {
instance.use(StoreToolsFinancing)
}
Passo 7: Adicione o componente à sua página Vue desejada
Agora você pode adicionar o componente "@solfacil/store-tools-financing"
ao arquivo ".vue" desejado em seu projeto. Certifique-se de fornecer os parâmetros necessários, como o ambiente, o ID do parceiro e o ID do carrinho. Aqui está um exemplo de como adicionar o componente:
<template>
<div>
<!-- Outro conteúdo da sua página -->
<!-- Adicione o componente StoreMarketFinancing com os parâmetros necessários -->
<StoreMarketFinancing
environment="stg"
partner-id="90891"
cart-id="650c3864-ac6f-44ed-afc3-851e15bd034f"
/>
<!-- Mais conteúdo da sua página, se houver -->
</div>
</template>
Componente
Propriedades
Nome | Tipo | Descrição |
---|---|---|
cartId | string | ID do carrinho |
partnerId | string | ID do parceiro |
environment | string | Ambiente de execução |
title | string | Título do componente |
subtitle | string | Subtítulo do componente |
hideHeader | boolean | Oculta o cabeçalho do componente |
hideFilters | boolean | Oculta os filtros do componente |
disableFilters | boolean | Desabilita os filtros do componente |
disableCart | boolean | Desabilita o carrinho do componente |
segmentationId | string | ID externo de identificação |
channel | enum | Canal de execução, valores 'LOJA', 'FINANCIAMENTO' |
filters | object | Filtros do componente |
----------------- | ----------------- | ----------------- |
8 days ago
8 days ago
8 days ago
14 days ago
14 days ago
16 days ago
26 days ago
29 days ago
29 days ago
29 days ago
29 days ago
29 days ago
29 days ago
29 days ago
30 days ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
4 months ago
4 months ago
5 months ago
5 months ago
6 months ago
6 months ago
6 months ago
6 months ago
6 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago
7 months ago