html-docx-js не может применять внешние стили класса CSS при создании файла DOCX - PullRequest
Новая
       6

html-docx-js не может применять внешние стили класса CSS при создании файла DOCX

0 голосов
/ 15 февраля 2019

Используя модуль html-docx-js, я могу конвертировать html-контент в формат docx.Однако я сталкиваюсь с проблемой, когда большая часть моего css загружается извне, а html-docx-js не применяет ни один из его стилей.

Упрощенный пример кода: 

const html = '<html><head><link rel="stylesheet" type="text/css" href="/styles/page.css"></head><body><div className={bold}>I am bold!</div></body></html>'
saveAs(htmlDocx.asBlob(html), 'bold.docx');

Это былопредложил использовать библиотеку соков, но это тоже не сработало.

Кто-нибудь знает, есть ли способ получить html-docx-js для загрузки внешнего css при создании файла docx?

1 Ответ

0 голосов
/ 18 февраля 2019

После небольшого исследования я нашел рабочее решение моей проблемы (проблем):

Существует модуль, называемый соком, который позволяет применять указанные css inline.

Потребности в сокекопия css, которую мне пришлось загружать отдельно.

Кроме того, поскольку html-docx-js может читать только первое определение стиля css внутри элемента, мне пришлось немного отрегулировать css и html, чтобы приспособиться к этому.

Итоговый код выглядит так: 

    import htmlDocx from 'html-docx-js/dist/html-docx';
    import saveAs from 'file-saver';
    const juice = require('juice');

     let getIndex = new Promise((resolve, reject) => {
      this.requests('GET', '/styles/index.css')
        .then(data =>
          data.text().then(css => {
            resolve(css);
          })
        )
        .catch(error => reject(error));
    });

    getIndex
      .then(css => {
        let html =
          '<!DOCTYPE html><html><head lang="en"><style></style>' +
          '<meta charset="UTF-8"><title>Report</title></head><body>' +
          this.report.innerHTML +
          '</body></html>';

        html = juice.inlineContent(html, css);
        let docx = htmlDocx.asBlob(html);
        saveAs(docx, 'report.docx');
      })
      .catch(error => {
        console.log(error);
      });
...