@babel/parser in browser

[k644606347]

I try to run @babel/parser ^ 7.18.9 in the browser to parse strings and display ast. I use webpack to build applications. It works well, but what is the problem with this?

I want the CDN version of @babel/parser, but the official only provides CJS. Maybe the official does not recommend running @babel/parser in the browser?

[nicolo-ribaudo]

You can load it from the skypack CDN:

import { parse } from "https://cdn.skypack.dev/@babel/parser"

or

const { parse } = await import("https://cdn.skypack.dev/@babel/parser")

[k644606347]

You can load it from the skypack CDN:

import { parse } from "https://cdn.skypack.dev/@babel/parser"

or

const { parse } = await import("https://cdn.skypack.dev/@babel/parser")

cool, but I want to download files and upload min.js to my production server.
I plan to customize a global variable such as window.__myparser, and then configure externals in webpack

[k644606347]

You can load it from the skypack CDN:

import { parse } from "https://cdn.skypack.dev/@babel/parser"

or

const { parse } = await import("https://cdn.skypack.dev/@babel/parser")

I found that Babel provides browser side installation:
<script src=" https://unpkg.com/ @babel/standalone/babel.min.js"></script>
can I use parse through window.Babel?

[kungfooman]

@k644606347 No, you can't, it's not exported in @babel/standalone (it is in the file, but out of reachable scope without a manual rewrite). But what you can do is:

<script>
    window.exports = {};
</script>
<script src="./node_modules/@babel/parser/lib/index.js"></script>

Don't forget:

npm install @babel/parser

Test it:

[shijiatongxue]

same issue

[shijiatongxue]

can we use babel parse function by import only babel standalone？

[kungfooman]

no, but there is another way to get access to parse, see answer above