images/babel-plugin-jsx
2
0
Fork 0
mirror of https://github.com/vuejs/babel-plugin-jsx.git synced 2024-11-10 09:39:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: console log ast in jsx explorer

Browse Source
This commit is contained in:
Amour1688 2020-06-14 16:18:50 +08:00
parent dd787c0256
commit 6913a51ee8
2 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/jsx-explorer/index.html
View File

@ -1,4 +1,4 @@
<title>Vue JSX Template Explorer</title>
<title>Vue JSX Explorer</title>
<div id="header"></div>
<div id="source" class="editor"></div>

12
packages/jsx-explorer/src/index.js
View File

@ -1,10 +1,17 @@
/* eslint-disable no-console */
// eslint-disable-next-line import/no-unresolved
import * as monaco from 'monaco-editor';
import { h, createApp } from 'vue';
import { transform } from '@babel/core';
import babelPluginJSx from '../../babel-plugin-jsx/src';
import './index.css';
// or import * as monaco from 'monaco-editor/esm/vs/editor/editor.api';
// if shipping only a subset of the features & languages is desired
createApp(
() => h('h1', null, 'Vue JSX Explorer'),
).mount('#header');
if (module.hot) {
module.hot.accept('../../babel-plugin-jsx/src', () => {
compile();
@ -50,11 +57,14 @@ const output = monaco.editor.create(document.getElementById('output'), {
const compile = () => {
const src = editor.getValue();
localStorage.setItem('state', src);
console.clear();
transform(src, {
babelrc: false,
plugins: [babelPluginJSx],
plugins: [[babelPluginJSx, { transformOn: true }]],
ast: true,
}, (err, result) => {
if (!err) {
console.log('AST', result.ast);
output.setValue(result.code);
} else {
output.setValue(err.message);