custom-skins v2.0.1

custom-skins

custom-skins é uma skin personalizada para o editor TinyMCE que remove as bordas do editor. Este pacote facilita a instalação e configuração da skin em projetos auto-hospedados.

Instalação

Você pode instalar o pacote via npm ou yarn:

npm install tinymce-custom-skins
# ou
yarn add tinymce-custom-skins

Configuração
Após a instalação, você precisa executar o script postinstall para copiar os arquivos necessários para a pasta public/tinymce do seu projeto. Adicione o seguinte script ao seu package.json:

"scripts": {
  "postinstall": "node ./postinstall.js"
}

Crie um arquivo chamado postinstall.js na raiz do seu projeto com o seguinte conteúdo:

const path = require('path');
const fse = require('fs-extra');

const topDir = "./";
fse.emptyDirSync(path.join(topDir, 'public', 'tinymce'));
fse.copySync(path.join(topDir, 'node_modules', 'tinymce'), path.join(topDir, 'public', 'tinymce'), { overwrite: true });
fse.copySync(path.join(topDir, 'node_modules', 'tinymce-custom-skins/build/skins/content'), path.join(topDir, 'public', 'tinymce/skins/content'), { overwrite: true });
fse.copySync(path.join(topDir, 'node_modules', 'tinymce-custom-skins/build/skins/ui'), path.join(topDir, 'public', 'tinymce/skins/ui'), { overwrite: true });

Execute o script postinstall usando npm ou yarn:

npm run postinstall
# ou
yarn postinstall

Uso
Para usar a skin personalizada no TinyMCE, configure o editor da seguinte forma:

tinymce.init({
  selector: 'textarea',  // Seletor para o elemento textarea
  license_key: "gpl",
  plugins: [
    'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'preview',
    'anchor', 'searchreplace', 'visualblocks', 'code', 'fullscreen',
    'insertdatetime', 'media', 'table', 'help', 'wordcount'
  ],
  toolbar: 'undo redo | blocks | ' +
    'bold italic backcolor | alignleft aligncenter ' +
    'alignright alignjustify | bullist numlist outdent indent | ' +
    'removeformat | image',
  content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }',
  skin_url: 'tinymce/skins/ui/custom'
});