Missing code and/or documentation when using custom layout #49
Description
Something in a recent version changed and broke how the custom layouts work. I've found the problem and wanted to document the solution here:
First, one of the critical steps for prismjs to work is to have a .language- class present on the page. In the default layout, there is .language.vue. When providing a custom layout, I think the editor slot should have that, but it does not. So the solution I found is to wrap the editor slot with a div with the class language-vue. This allows prismjs styles to be applied.
Secondly, it looks like the inclusion of critical assets has been changed. The prism theme and prism editor CSS are no longer included by default when you provide a custom layout. I looked at the default layout Vue file to find my solution which was to include those assets in my custom layout
<script>
import "prismjs/themes/prism-okaidia.css";
import "vue-prism-editor/dist/prismeditor.min.css";
</script>If I get the chance, I'll see about opening a PR for this. In the meantime, I wanted to document these issues here in case others run into them and need a solution.
For the fix, does it make more sense to fix the issue in the code, or was this a deliberate design? If so, then I can just add more documentation around it.