@rasahq/xdm-tabula v2.0.0-alpha.22
@rasahq/xdm-tabula
API
md2Html | xxx |
md2InlineHtml | xxx |
mdx2Jsx | xxx |
mdx2InlineJsx | xxx |
mdxCompile | xxx |
MDXRenderer | renders mdx-jsx string |
MDXProvider | provides Context to MDXRenderer |
compileMDX(str, { inline: true })
renderMarkdown(str, { inline: true })
compile mdx process markdown render
questions
- does this fully work with SSR on Next and Gatsby
MDX compile and render steps
GOALS
- automatically replace
a
with projectLink
component - automatically extract a list of the magic shortcodes contained in an MDX block
markdown compile & render steps
GOALS
- automatically replace
a
with projectLink
component
unified processing
babel configuration
GOALS
- use the config which is local to the project
- keep processing low, as in the
lessBabel
option in gatsby-plugin-mdx
NOTES
- when no config is present and no
targets
option is passed, preset-env defaults to preset-latest, transforming everything down to ES5 (bad—planned to be revised in babel 8); therefore it must always be used with a config, or with a specialtargets
string, e.g.:targets: { esmodules: true }
will ignore browser configs and build for module-supporting browsers. this is ideal for a two-part build, where you are serving two bundle types
- other options:
bugfixes
: this option "tries to compile the broken syntax to the closest non-broken modern syntax supported by your target browsers", consolidating various features sets in a smaller and smarter way (worth a try)useBuiltIns
: defaults tofalse
, could be'entry'
or'usage'
: in the latter cases it's recommended to also addcore-js@3
and specify thecorejs: 3
option. (question: what does gatsby do here?)browserslistEnv
: tells babel to use a specific environment; probably should not be specified at library level but rather in project; applies to projects which specify environment sub-configs that key off ofBROWSERSLIST_ENV
orNODE_ENV
.
- recommended configuration method:
babel
recommends using.browserslistrc
. Here you specify queries in separate lines in a plain text file.browserslist
recommends usingbrowserslist
key inpackage.json
. Here you specify queries as separate strings in an array.
- about additional plugins:
babel-plugin-remove-export-keywords
comes from @mdx-js and seems only relevant to files; we are going to assume that our MDX strings from the CMS contain neither imports nor exports, but as noted in this issue thread, the combination of skipExport: true and this plugin can be used to turn an MDX file in to a function, as a beginning transformationbabel-plugin-remove-make-shortcode
andbabel-plugin-remove-imports
are being kept around here, in case they are useful for eventualy file (page-component) MDX parsing
/ CONSIDER as defaults: https://github.com/remarkjs/remark-squeeze-paragraphs https://github.com/rehypejs/rehype-minify/tree/main/packages/rehype-minify-whitespace /
module.exports = { remarkPlugins: [ // require('./lib/remark-abbr'), {}, require('remark-kbd'), {}, require('remark-mark-plus'), {}, require('remark-sources'), {}, // require('remark-images'), {}, // require('remark-collapse'), { test: '' }, // require('remark-unwrap-images'), {}, // require('./plugins/remark-figure-caption'), {}, ], rehypePlugins: [require('./rehype-figure'), {}], };
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago