TinyMCE content_css из глобальной таблицы стилей Angular 6

Я хочу, чтобы стили редактируемой области редактора TinyMCE были такими же, как в моем приложении Angular 6. Я знаю, что могу установить content_css

content_css: 'https://testing.local/dist/styles.a9fe3df792f457e5d228.css'

Но я должен изменять эту строку кода каждый раз, когда изменяется имя файла css. Также, как заставить его работать, чтобы я мог протестировать свое приложение с помощью:

ng s

Tnx для вашего времени

Не могли бы вы создать файл CSS со статическим именем, чтобы передать в редактор те же стили, что и ваше приложение?

— 30.08.2018 19:55

css angular tinymce

28.08.2018 13:47

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

CSS: FlexBox

Ранее разработчики использовали макеты с помощью Position и Float. После появления flexbox сценарий полностью изменился.

742

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Хорошо, у меня есть решение моей проблемы.

Изменен contact_css для использования переменных окружения

content_css: environment.globalStylesheetUrl

В environmentmant.ts у меня есть

 globalStylesheetUrl: 'http://localhost:4200/assets/css/content-styles.css'

Установлен gulp, и мой файл gulpfile:

'use strict';

var gulp = require('gulp');
var sass = require('gulp-sass');
var concat = require('gulp-concat');

gulp.task('styles', function () {
    return gulp.src(['./scss/bootstrap/bootstrap.scss', './scss/mdb.scss'])
        .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
        .pipe(concat('content-styles.css'))
        .pipe(gulp.dest('./src/assets/css'));
});

gulp.task('styles-build', function () {
    return gulp.src(['./scss/bootstrap/bootstrap.scss', './scss/mdb.scss'])
        .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
        .pipe(concat('content-styles.css'))
        .pipe(gulp.dest('./dist/'));
});

Также добавлены скрипты в package.json

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --prod",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "development": "gulp styles && ng s -o --aot",  //added this for development
    "production": "gulp styles-build && ng build --prod"  //added this for production
  },

Теперь я могу