Faça sua pergunta e obtenha um resumo do documento referenciando esta página e o provedor AI de sua escolha
Ao integrar o servidor MCP Intlayer ao seu assistente de IA, você pode recuperar todos os documentos diretamente de ChatGPT, DeepSeek, Cursor, VSCode, etc.
Ver a documentação do servidor MCPO conteúdo desta página foi traduzido com uma IA.
Veja a última versão do conteúdo original em inglêsSe você tiver uma ideia para melhorar esta documentação, sinta-se à vontade para contribuir enviando uma pull request no GitHub.
Link do GitHub para a documentaçãoCopiar o Markdown do documento para a área de transferência
intlayer-editor: Pacote NPM para usar o editor visual Intlayer
Intlayer é um conjunto de pacotes projetados especificamente para desenvolvedores JavaScript. É compatível com frameworks como React, React e Express.js.
O pacote intlayer-editor é um pacote NPM que integra o editor visual Intlayer ao seu projeto React.
Como o Editor Intlayer Funciona
O editor Intlayer permite interagir com o dicionário remoto do Intlayer. Ele pode ser instalado no lado do cliente e transformar sua aplicação em um editor semelhante a um CMS para gerenciar o conteúdo do seu site em todos os idiomas configurados.
Instalação
Instale o pacote necessário usando seu gerenciador de pacotes preferido:
Copiar o código para a área de transferência
npm install intlayer-editorConfiguração
No seu arquivo de configuração do Intlayer, você pode personalizar as configurações do editor:
Copiar o código para a área de transferência
const config: IntlayerConfig = { // ... outras configurações editor: { enabled: process.env.INTLAYER_ENABLED === "true", // Se falso, o editor está inativo e não pode ser acessado. // Client ID e client secret são necessários para habilitar o editor. // Eles permitem identificar o usuário que está editando o conteúdo. // Podem ser obtidos criando um novo cliente no Intlayer Dashboard - Projects (https://intlayer.org/dashboard/projects). clientId: process.env.INTLAYER_CLIENT_ID, clientSecret: process.env.INTLAYER_CLIENT_SECRET, },};Se você não possui um client ID e client secret, pode obtê-los criando um novo cliente no Intlayer Dashboard - Projects.
Para ver todos os parâmetros disponíveis, consulte a documentação de configuração
O pacote intlayer-editor é baseado no Intlayer e está disponível para aplicações JavaScript, como React (Create React App), Vite + React e Next.js.
Para mais detalhes sobre como instalar o pacote, veja a seção relevante abaixo:
Integração com Next.js
Para integração com Next.js, consulte o guia de configuração.
Integração com Create React App
Para integração com Create React App, consulte o guia de configuração
Integração com Vite + React
Para integração com Vite + React, consulte o guia de configuração
Exemplo de integração
Para integrar o editor visual Intlayer no seu projeto React, siga estes passos:
Importe o componente do editor Intlayer na sua aplicação React:
src/App.jsxCopiar códigoCopiar o código para a área de transferência
import { IntlayerEditorProvider } from "intlayer-editor";import { IntlayerProvider } from "react-intlayer";export default function App() { return ( <IntlayerProvider> <IntlayerEditorProvider> <IntlayerEditor> {/* O conteúdo da sua aplicação aqui */} </IntlayerEditor> </IntlayerEditorProvider> </IntlayerProvider> );}Importe os estilos do editor Intlayer na sua aplicação Next.js:
src/app/[locale]/layout.jsxCopiar códigoCopiar o código para a área de transferência
import { IntlayerEditorStyles } from "intlayer-editor";export default async function RootLayout({ children, params }) { const { locale } = await params; return ( <IntlayerClientProvider locale={locale}> <IntlayerEditorProvider> <html lang={locale}> <body className={IntlayerEditorStyles}>{children}</body> </html> </IntlayerEditorProvider> </IntlayerClientProvider> );}
Usando o Editor
Quando o editor está instalado, ativado e iniciado, você pode visualizar cada campo indexado pelo Intlayer passando o cursor sobre o seu conteúdo.
Se o seu conteúdo estiver contornado, você pode pressioná-lo por um tempo para exibir a gaveta de edição.
Histórico do Documento
- 5.5.10 - 2025-06-29: Histórico inicial