TinyMCE 不接受 content_css 初始化参数

Question

我正在尝试将 CSS 添加到我正在工作的文本框的内容中，但在此过程中的某个地方，我失去了链接 CSS 文件以更改 iframe 内容样式的能力；我之前有它工作过。

这是我的初始化脚本：

tinymce.init({
  selector: '#id_body',
  mobile: {theme: 'mobile'},
  themes: 'modern',
  height: 480,
  menubar: false,
  plugins: [
    'advlist autolink autosave fullscreen help link lists paste preview searchreplace spellchecker table visualblocks wordcount'
  ],
  toolbar: 'fullscreen | undo redo | formatselect | spellchecker | bold italic underline | strikethrough  subscript superscript blockquote | link | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | removeformat help',
  skin: 'mwd-dark',
  skin_url: '/static/lib/tinymce/skins/mwd-dark',
  content_css: [
    '/static/home/css/reset.css',
    '/static/home/css/tinyMCE.css',
  ],
});

mwd-dark 是我编写的自定义皮肤。我的控制台中没有错误。导航到前面带有 localhost:8000 的 URL 会加载正确的文件。

相关文档在这里：https://www.tiny.cloud/docs/configure/content-appearance/#content_css

也在文档中：https://www.tiny.cloud/docs/configure/content-appearance/#browsercaching

浏览器缓存可能会导致 TinyMCE 无法读取更改的 CSS 文件的内容。您会看到“旧”的颜色和样式。

一种解决方案是在 content_css 或 editor_css 的文件发生更改时手动清除浏览器缓存。另一种解决方案是使用旧的 hack，它向包含当前时间戳的 URL 添加一个虚假参数，例如“myFile.css?bogus=10023561235”。可能的解决方案如下所示：

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  content_css: 'path/myfile.css?' + new Date().getTime()
});

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  content_css: 'path/myscript.php?myParam=myValue&bogus=' + new Date().getTime()
});

我试过了：

• 清除缓存（见接受的答案）
• 添加“假”参数
• 重新启动浏览器
• 重新启动我的电脑
• 注释掉 skin 和 skin_url 参数，以防我的皮肤是问题的原因
• 一次包含一个 CSS 文件（'' 和 ['']）

有什么想法吗？

编辑

tinyMCE.sass

@import url('https://fonts.googleapis.com/css?family=Patua+One|Roboto')
  
@import '_variables'
@import '_mixins'

body
  background-color: $mid-gray
  color: $white
  font-family: $font-body

  a
    color: $light-blue

h1, h2, h3, h4, h5, h6
  font-family: $font-title

  & > a
    text-decoration: underline
    @include transition(color, .15s)

    &:hover
      color: $light-blue

h1, h2
  &, & > a
    color: $yellow

h3, h4
  &, & > a
    color: $orange

h5, h6
  &, & > a
    color: $green

h6
  font-size: 2rem !important

em
  font-style: italic

ul, ol
  padding-left: 2.5rem

ul
  list-style-type: disc

ol
  list-style-type: decimal

pre
  padding: 1rem
  border: 1px solid $light-gray
  border-radius: .25rem
  color: $light-gray
  background-color: $darker-gray

blockquote
  margin-left: 18px
  border-left: .25rem solid $purple
  padding: 1rem
  background-color: $dark-gray

  & > *:last-child
    margin-bottom: 0

tinyMCE.css

@import url("https://fonts.googleapis.com/css?family=Patua+One|Roboto");
body {
  background-color: #444444;
  color: #ffffff;
  font-family: "Roboto", Helvetica, Arial, sans-serif;
}
body a {
  color: #569cd6;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Patua One", Helvetica, Arial, sans-serif;
}
h1 > a, h2 > a, h3 > a, h4 > a, h5 > a, h6 > a {
  text-decoration: underline;
  -webkit-transition: color 0.15s ease-in-out;
  transition: color 0.15s ease-in-out;
}
h1 > a:hover, h2 > a:hover, h3 > a:hover, h4 > a:hover, h5 > a:hover, h6 > a:hover {
  color: #569cd6;
}

h1, h1 > a, h2, h2 > a {
  color: #d1d18b;
}

h3, h3 > a, h4, h4 > a {
  color: #bb846e;
}

h5, h5 > a, h6, h6 > a {
  color: #679452;
}

h6 {
  font-size: 2rem !important;
}

em {
  font-style: italic;
}

ul, ol {
  padding-left: 2.5rem;
}

ul {
  list-style-type: disc;
}

ol {
  list-style-type: decimal;
}

pre {
  padding: 1rem;
  border: 1px solid #818181;
  border-radius: 0.25rem;
  color: #818181;
  background-color: #1e1e1e;
}

blockquote {
  margin-left: 18px;
  border-left: 0.25rem solid #9f62c2;
  padding: 1rem;
  background-color: #333333;
}
blockquote > *:last-child {
  margin-bottom: 0;
}

/*# sourceMappingURL=tinyMCE.css.map */

Answer 1

我发现问题在于我没有正确清除缓存。这个浏览器扩展对我不起作用：https://addons.mozilla.org/en-US/firefox/addon/clearcache/