Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

vue-inbrowser-compiler

Package Overview
Dependencies
Maintainers
3
Versions
72
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue-inbrowser-compiler - npm Package Compare versions

Comparing version 4.44.23 to 4.44.24

src/compileVueCodeForEvalFunction.spec.ts

357

CHANGELOG.md
# Change Log
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## 4.44.24
## [4.44.23](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.22...v4.44.23) (2022-03-25)
### Patch Changes
**Note:** Version bump only for package vue-inbrowser-compiler
- [`14bd0c08`](https://github.com/vue-styleguidist/vue-styleguidist/commit/14bd0c0868ed12cd0c7eda7ebce662195c078575) Thanks [@elevatebart](https://github.com/elevatebart)! - remove the require statement in esm
All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
## [4.44.23](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.22...v4.44.23) (2022-03-25)
**Note:** Version bump only for package vue-inbrowser-compiler
## [4.44.22](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.21...v4.44.22) (2022-03-18)

@@ -18,6 +19,2 @@

## [4.44.21](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.20...v4.44.21) (2022-03-18)

@@ -27,37 +24,19 @@

## [4.44.20](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.19...v4.44.20) (2022-03-18)
### Bug Fixes
* create postinstall to adapt vue3 ([7de0803](https://github.com/vue-styleguidist/vue-styleguidist/commit/7de0803c670a0532af409f6798cc008ffb2e13bf))
- create postinstall to adapt vue3 ([7de0803](https://github.com/vue-styleguidist/vue-styleguidist/commit/7de0803c670a0532af409f6798cc008ffb2e13bf))
## [4.44.17](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.16...v4.44.17) (2022-02-28)
### Bug Fixes
* avoid adding h to pragmas in vue3 ([bb265cb](https://github.com/vue-styleguidist/vue-styleguidist/commit/bb265cbef713177dd4772dda7cb582208a95f376))
* remove h from vue3 in inbrowser compiler ([cf7305a](https://github.com/vue-styleguidist/vue-styleguidist/commit/cf7305a7896eaced7dbadc89144ab6a1e4cf5e48))
- avoid adding h to pragmas in vue3 ([bb265cb](https://github.com/vue-styleguidist/vue-styleguidist/commit/bb265cbef713177dd4772dda7cb582208a95f376))
- remove h from vue3 in inbrowser compiler ([cf7305a](https://github.com/vue-styleguidist/vue-styleguidist/commit/cf7305a7896eaced7dbadc89144ab6a1e4cf5e48))
# 4.44.0 (2022-01-17)
## [4.44.16](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.15...v4.44.16) (2022-02-22)
## 4.44.2 (2022-01-18)

@@ -67,6 +46,2 @@

## 4.44.15 (2022-01-31)

@@ -76,6 +51,2 @@

## 4.44.14 (2022-01-31)

@@ -85,6 +56,2 @@

## 4.44.13 (2022-01-31)

@@ -94,6 +61,2 @@

## 4.44.12 (2022-01-31)

@@ -103,6 +66,2 @@

## 4.44.11 (2022-01-31)

@@ -112,6 +71,2 @@

## 4.44.10 (2022-01-31)

@@ -121,6 +76,2 @@

## 4.44.9 (2022-01-31)

@@ -130,6 +81,2 @@

## 4.44.8 (2022-01-31)

@@ -139,6 +86,2 @@

## 4.44.7 (2022-01-31)

@@ -148,6 +91,2 @@

## 4.44.6 (2022-01-31)

@@ -157,6 +96,2 @@

## 4.44.5 (2022-01-31)

@@ -166,6 +101,2 @@

## 4.44.4 (2022-01-31)

@@ -175,6 +106,2 @@

## [4.44.3](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.44.2...v4.44.3) (2022-01-31)

@@ -184,6 +111,2 @@

# [4.44.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.43.3...v4.44.0) (2022-01-17)

@@ -193,6 +116,2 @@

## [4.43.3](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.43.2...v4.43.3) (2022-01-13)

@@ -202,6 +121,2 @@

## [4.43.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.43.1...v4.43.2) (2022-01-03)

@@ -211,17 +126,8 @@

## [4.43.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.43.0...v4.43.1) (2021-12-23)
### Bug Fixes
* should escape interpolation inside template string ([a90c1d4](https://github.com/vue-styleguidist/vue-styleguidist/commit/a90c1d48bc6675b286e715d99cef46e3f8483aa8))
- should escape interpolation inside template string ([a90c1d4](https://github.com/vue-styleguidist/vue-styleguidist/commit/a90c1d48bc6675b286e715d99cef46e3f8483aa8))
# [4.43.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.42.0...v4.43.0) (2021-11-21)

@@ -231,6 +137,2 @@

# [4.42.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.41.3...v4.42.0) (2021-11-18)

@@ -240,6 +142,2 @@

## [4.41.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.41.1...v4.41.2) (2021-09-09)

@@ -249,17 +147,8 @@

# [4.41.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.40.0...v4.41.0) (2021-08-13)
### Bug Fixes
* **deps:** update all ([78807c3](https://github.com/vue-styleguidist/vue-styleguidist/commit/78807c34893be6746b4f18e0d3d1d706a4e816af))
- **deps:** update all ([78807c3](https://github.com/vue-styleguidist/vue-styleguidist/commit/78807c34893be6746b4f18e0d3d1d706a4e816af))
# [4.40.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.39.0...v4.40.0) (2021-06-07)

@@ -269,6 +158,2 @@

# [4.39.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.38.3...v4.39.0) (2021-05-24)

@@ -278,6 +163,2 @@

## [4.38.3](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.38.2...v4.38.3) (2021-05-24)

@@ -287,6 +168,2 @@

# [4.37.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.36.1...v4.37.0) (2021-04-05)

@@ -296,6 +173,2 @@

## [4.33.6](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.33.5...v4.33.6) (2020-11-05)

@@ -305,29 +178,15 @@

## [4.33.5](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.33.4...v4.33.5) (2020-10-23)
### Bug Fixes
* **compiler:** only allow max version of each bro ([a062a54](https://github.com/vue-styleguidist/vue-styleguidist/commit/a062a5405b9793e46bf33ec49a6f3d6511fb7e28))
* **compiler:** types of buble transform ([6134866](https://github.com/vue-styleguidist/vue-styleguidist/commit/613486628511b2113fcda5e7377207ce70e00f23))
- **compiler:** only allow max version of each bro ([a062a54](https://github.com/vue-styleguidist/vue-styleguidist/commit/a062a5405b9793e46bf33ec49a6f3d6511fb7e28))
- **compiler:** types of buble transform ([6134866](https://github.com/vue-styleguidist/vue-styleguidist/commit/613486628511b2113fcda5e7377207ce70e00f23))
## [4.33.4](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.33.3...v4.33.4) (2020-10-22)
### Bug Fixes
* **compiler:** error location reporting ([34121b5](https://github.com/vue-styleguidist/vue-styleguidist/commit/34121b50a0da31d92b5d47fcd94e2b23634bffce))
- **compiler:** error location reporting ([34121b5](https://github.com/vue-styleguidist/vue-styleguidist/commit/34121b50a0da31d92b5d47fcd94e2b23634bffce))
## [4.33.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.33.1...v4.33.2) (2020-10-19)

@@ -337,6 +196,2 @@

# [4.33.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.32.4...v4.33.0) (2020-10-12)

@@ -346,6 +201,2 @@

## [4.32.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.32.0...v4.32.1) (2020-09-08)

@@ -355,6 +206,2 @@

## [4.31.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.31.1...v4.31.2) (2020-08-23)

@@ -364,6 +211,2 @@

## [4.31.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.31.0...v4.31.1) (2020-08-20)

@@ -373,6 +216,2 @@

# [4.27.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.26.3...v4.27.0) (2020-07-17)

@@ -382,6 +221,2 @@

## [4.23.3](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.23.2...v4.23.3) (2020-05-20)

@@ -391,6 +226,2 @@

# [4.16.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.15.2...v4.16.0) (2020-04-09)

@@ -400,6 +231,2 @@

# [4.14.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.13.1...v4.14.0) (2020-03-18)

@@ -409,6 +236,2 @@

## [4.2.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.2.1...v4.2.2) (2019-12-18)

@@ -418,6 +241,2 @@

## [4.0.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.0.0...v4.0.1) (2019-11-15)

@@ -427,6 +246,2 @@

# [4.0.0-beta.20](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.0.0-beta.19...v4.0.0-beta.20) (2019-11-15)

@@ -436,6 +251,2 @@

# [4.0.0-beta.8](https://github.com/vue-styleguidist/vue-styleguidist/compare/v4.0.0-beta.7...v4.0.0-beta.8) (2019-10-28)

@@ -445,6 +256,2 @@

# [4.0.0-beta.3](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.25.1-beta.1...v4.0.0-beta.3) (2019-10-24)

@@ -454,6 +261,2 @@

# [4.0.0-beta.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.25.1-beta.1...v4.0.0-beta.1) (2019-10-23)

@@ -463,35 +266,19 @@

## [3.25.1-beta.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.25.1-beta.0...v3.25.1-beta.1) (2019-10-23)
### Bug Fixes
* split compiler & utils - efficient code split ([9ef9d06](https://github.com/vue-styleguidist/vue-styleguidist/commit/9ef9d06))
- split compiler & utils - efficient code split ([9ef9d06](https://github.com/vue-styleguidist/vue-styleguidist/commit/9ef9d06))
### BREAKING CHANGES
* compiler now exports compiler function as default
* isCodeVueSfc, styleScoper and adaptCreateElement
are now their own package
- compiler now exports compiler function as default
- isCodeVueSfc, styleScoper and adaptCreateElement are now their own package
# [3.23.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.22.3...v3.23.0) (2019-09-19)
### Features
* **compiler:** styleScoper deals with deep ([ff89890](https://github.com/vue-styleguidist/vue-styleguidist/commit/ff89890))
- **compiler:** styleScoper deals with deep ([ff89890](https://github.com/vue-styleguidist/vue-styleguidist/commit/ff89890))
## [3.22.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.22.0...v3.22.1) (2019-08-19)

@@ -501,6 +288,2 @@

# [3.21.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.20.5...v3.21.0) (2019-08-17)

@@ -510,151 +293,89 @@

# [3.19.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.18.1...v3.19.0) (2019-08-02)
### Bug Fixes
* combining new Vue and imports was impossible ([d37359c](https://github.com/vue-styleguidist/vue-styleguidist/commit/d37359c))
- combining new Vue and imports was impossible ([d37359c](https://github.com/vue-styleguidist/vue-styleguidist/commit/d37359c))
### Features
* allow import syntax ([5c61678](https://github.com/vue-styleguidist/vue-styleguidist/commit/5c61678)), closes [#104](https://github.com/vue-styleguidist/vue-styleguidist/issues/104)
- allow import syntax ([5c61678](https://github.com/vue-styleguidist/vue-styleguidist/commit/5c61678)), closes [#104](https://github.com/vue-styleguidist/vue-styleguidist/issues/104)
## [3.16.3](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.16.2...v3.16.3) (2019-07-19)
### Bug Fixes
* accept multiple style parts ([9a6b031](https://github.com/vue-styleguidist/vue-styleguidist/commit/9a6b031))
* use style normalize sfc component ([fcae13c](https://github.com/vue-styleguidist/vue-styleguidist/commit/fcae13c))
- accept multiple style parts ([9a6b031](https://github.com/vue-styleguidist/vue-styleguidist/commit/9a6b031))
- use style normalize sfc component ([fcae13c](https://github.com/vue-styleguidist/vue-styleguidist/commit/fcae13c))
### Performance Improvements
* create new simpler parser ([d8acf85](https://github.com/vue-styleguidist/vue-styleguidist/commit/d8acf85))
* use the new parser ([385b018](https://github.com/vue-styleguidist/vue-styleguidist/commit/385b018))
- create new simpler parser ([d8acf85](https://github.com/vue-styleguidist/vue-styleguidist/commit/d8acf85))
- use the new parser ([385b018](https://github.com/vue-styleguidist/vue-styleguidist/commit/385b018))
## [3.16.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.16.1...v3.16.2) (2019-07-17)
### Bug Fixes
* **compiler:** make the jsx spread work vue style ([27dd670](https://github.com/vue-styleguidist/vue-styleguidist/commit/27dd670))
* make regexp more precise ([29ba8b5](https://github.com/vue-styleguidist/vue-styleguidist/commit/29ba8b5))
- **compiler:** make the jsx spread work vue style ([27dd670](https://github.com/vue-styleguidist/vue-styleguidist/commit/27dd670))
- make regexp more precise ([29ba8b5](https://github.com/vue-styleguidist/vue-styleguidist/commit/29ba8b5))
## [3.16.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.16.0...v3.16.1) (2019-07-16)
### Bug Fixes
* **compiler:** add normal attributes in attrs ([be6de16](https://github.com/vue-styleguidist/vue-styleguidist/commit/be6de16))
* allow for new Vue in jsx ([45c62c9](https://github.com/vue-styleguidist/vue-styleguidist/commit/45c62c9))
- **compiler:** add normal attributes in attrs ([be6de16](https://github.com/vue-styleguidist/vue-styleguidist/commit/be6de16))
- allow for new Vue in jsx ([45c62c9](https://github.com/vue-styleguidist/vue-styleguidist/commit/45c62c9))
# [3.16.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.15.4...v3.16.0) (2019-07-15)
### Bug Fixes
* rename createElement ([429dd96](https://github.com/vue-styleguidist/vue-styleguidist/commit/429dd96))
- rename createElement ([429dd96](https://github.com/vue-styleguidist/vue-styleguidist/commit/429dd96))
### Features
* add Higher order funciton to Compile pragmas ([5783eb4](https://github.com/vue-styleguidist/vue-styleguidist/commit/5783eb4))
* allow compiler to render/compile JSX ([5084a39](https://github.com/vue-styleguidist/vue-styleguidist/commit/5084a39))
- add Higher order funciton to Compile pragmas ([5783eb4](https://github.com/vue-styleguidist/vue-styleguidist/commit/5783eb4))
- allow compiler to render/compile JSX ([5084a39](https://github.com/vue-styleguidist/vue-styleguidist/commit/5084a39))
## [3.15.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.15.0...v3.15.1) (2019-06-27)
### Bug Fixes
* make sure imported variables are declared ([bc50ab1](https://github.com/vue-styleguidist/vue-styleguidist/commit/bc50ab1))
* **compiler:** make sure files with the same name wont conflict ([98a1b76](https://github.com/vue-styleguidist/vue-styleguidist/commit/98a1b76)), closes [#471](https://github.com/vue-styleguidist/vue-styleguidist/issues/471)
- make sure imported variables are declared ([bc50ab1](https://github.com/vue-styleguidist/vue-styleguidist/commit/bc50ab1))
- **compiler:** make sure files with the same name wont conflict ([98a1b76](https://github.com/vue-styleguidist/vue-styleguidist/commit/98a1b76)), closes [#471](https://github.com/vue-styleguidist/vue-styleguidist/issues/471)
## [3.14.4](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.14.3...v3.14.4) (2019-06-14)
### Bug Fixes
* **compiler:** re-enable compilation in vue SFC ([5bb99c3](https://github.com/vue-styleguidist/vue-styleguidist/commit/5bb99c3)), closes [#456](https://github.com/vue-styleguidist/vue-styleguidist/issues/456)
- **compiler:** re-enable compilation in vue SFC ([5bb99c3](https://github.com/vue-styleguidist/vue-styleguidist/commit/5bb99c3)), closes [#456](https://github.com/vue-styleguidist/vue-styleguidist/issues/456)
## [3.14.2](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.14.1...v3.14.2) (2019-06-06)
### Bug Fixes
* **docgen:** make sure v-slot templates are understood too ([e9ab6d5](https://github.com/vue-styleguidist/vue-styleguidist/commit/e9ab6d5))
- **docgen:** make sure v-slot templates are understood too ([e9ab6d5](https://github.com/vue-styleguidist/vue-styleguidist/commit/e9ab6d5))
## [3.14.1](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.14.0...v3.14.1) (2019-06-05)
### Bug Fixes
* **docgen:** template was used to use slots - sfc was detected ([642d875](https://github.com/vue-styleguidist/vue-styleguidist/commit/642d875)), closes [#448](https://github.com/vue-styleguidist/vue-styleguidist/issues/448)
- **docgen:** template was used to use slots - sfc was detected ([642d875](https://github.com/vue-styleguidist/vue-styleguidist/commit/642d875)), closes [#448](https://github.com/vue-styleguidist/vue-styleguidist/issues/448)
# [3.14.0](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.13.10...v3.14.0) (2019-06-05)
### Bug Fixes
* bring back last version of acorn ([1f7ee42](https://github.com/vue-styleguidist/vue-styleguidist/commit/1f7ee42))
- bring back last version of acorn ([1f7ee42](https://github.com/vue-styleguidist/vue-styleguidist/commit/1f7ee42))
## [3.13.10](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.13.9...v3.13.10) (2019-06-04)
### Bug Fixes
* detect pure template no script as sfc ([e2a0a48](https://github.com/vue-styleguidist/vue-styleguidist/commit/e2a0a48))
* downgrade acorn ([40b60cb](https://github.com/vue-styleguidist/vue-styleguidist/commit/40b60cb))
- detect pure template no script as sfc ([e2a0a48](https://github.com/vue-styleguidist/vue-styleguidist/commit/e2a0a48))
- downgrade acorn ([40b60cb](https://github.com/vue-styleguidist/vue-styleguidist/commit/40b60cb))
## [3.13.8](https://github.com/vue-styleguidist/vue-styleguidist/compare/v3.13.7...v3.13.8) (2019-05-29)
**Note:** Version bump only for package vue-inbrowser-compiler

@@ -9,2 +9,3 @@ 'use strict';

var acorn = require('acorn');
var jsx = require('acorn-jsx');
var detectBrowser = require('detect-browser');

@@ -15,2 +16,3 @@

var walkes__default = /*#__PURE__*/_interopDefaultLegacy(walkes);
var jsx__default = /*#__PURE__*/_interopDefaultLegacy(jsx);

@@ -91,5 +93,3 @@ /*! *****************************************************************************

// eslint-disable-next-line @typescript-eslint/no-var-requires
var jsx = require('acorn-jsx');
var extendedParser = acorn.Parser.extend(jsx());
var extendedParser = acorn.Parser.extend(jsx__default["default"]());
function getAst(code) {

@@ -96,0 +96,0 @@ return extendedParser.parse(code, {

@@ -6,2 +6,3 @@ import { parseComponent, isVue3, isCodeVueSfc } from 'vue-inbrowser-compiler-utils';

import { Parser } from 'acorn';
import jsx from 'acorn-jsx';
import { detect } from 'detect-browser';

@@ -83,4 +84,2 @@

// eslint-disable-next-line @typescript-eslint/no-var-requires
var jsx = require('acorn-jsx');
var extendedParser = Parser.extend(jsx());

@@ -87,0 +86,0 @@ function getAst(code) {

{
"name": "vue-inbrowser-compiler",
"version": "4.44.23",
"version": "4.44.24",
"description": "compile vue single file components right in your browser",

@@ -8,6 +8,2 @@ "module": "lib/vue-inbrowser-compiler.esm.js",

"types": "lib/types/index.d.ts",
"scripts": {
"compile": "rollup -c",
"compile:watch": "rollup -c --watch"
},
"keywords": [

@@ -51,3 +47,7 @@ "vue",

},
"gitHead": "c67dce1ee82a08d320f00d8d2db8fc7255c7a02d"
}
"scripts": {
"compile": "rollup -c",
"compile:watch": "rollup -c --watch"
},
"readme": "# vue-inbrowser-compiler\n\nCompile vue components code into vue components objects inside of your browser\n\n## install\n\n```bash\nyarn add vue-inbrowser-compiler\n```\n\n## usage\n\nThis library is meant to help write components for vue that can be edited through text.\n\n### compile\n\nCompiles a string of pseudo javascript code written in es2015. It returns the body of a function as a string. Once you execute the function, it will return a VueJS component.\n\n**prototype**: `compile(code: string, config: BubleConfig): {script: string, style: string}`\n\n```js\nimport { compile } from 'vue-inbrowser-compiler'\n\n/**\n * render a component\n */\nfunction getComponent(code) {\n const conpiledCode = compile(\n code,\n // pass in config options to buble to set up the output\n {\n target: { ie: 11 }\n }\n )\n const func = new Function(conpiledCode.script)\n return func()\n}\n```\n\nThe formats of the code here are the same as vue-live and vue-styleguidist\n\n#### pseudo jsx\n\nMost common use case is a simple vue template.\n\n```html\n<button color=\"blue\">Test This Buttton</button>\n```\n\nwill be transformed into\n\n```js\nreturn {\n template: '<Button color=\"blue\">Test This Buttton</Button>'\n}\n```\n\nA more advanced use case if you want to use variables\n\n```jsx\n// initialize variables here and use them below\nlet show = true\nlet today = new Date();\n\n// starting from the first line that starts with a <tag>,\n// the rest is considered a template\n<input type=\"checkbox\" v-model=\"show\">\n<date-picker\n style=\"text-align:center;\"\n v-if=\"show\"\n :value=\"today\"/>\n```\n\nwill turn into\n\n```js\nlet show = true\nlet today = new Date();\n\nreturn {\n data(){\n return{\n show: show,\n today: today\n }\n }\n template: `<input type=\"checkbox\" v-model=\"show\">\n<date-picker\n style=\"text-align:center;\"\n v-if=\"show\"\n :value=\"today\"/>`\n}\n```\n\n#### Vue apps\n\nA simple way to make it explicit\n\n```js\nnew Vue({\n template: `\n<div>\n <input v-model=\"value\" type=\"checkbox\">\n <h1 v-if=\"value\">I am checked</h1>\n</div>`,\n data() {\n return {\n value: false\n }\n }\n})\n```\n\n#### Single File Components\n\n```html\n<template>\n <div class=\"hello\">\n <h1>Colored Text</h1>\n <button>{{ msg }}</button>\n </div>\n</template>\n\n<script>\n export default {\n data() {\n return {\n msg: 'Push Me'\n }\n }\n }\n</script>\n\n<style>\n .hello {\n text-align: center;\n color: #900;\n }\n</style>\n```\n\n### isCodeVueSfc\n\nDetects if the code given corresponds to a VueJS [Single File Component](https://vuejs.org/v2/guide/single-file-components.html). If there is a `<template>` or a `<script>` tag, it will return true, otherwise return false.\n\n**prototype**: `isCodeVueSfc(code: string):boolean`\n\n```js\nimport { isCodeVueSfc } from 'vue-inbrowser-compiler'\n\nif (isCodeVueSfc(code)) {\n doStuffForSFC(code)\n} else {\n doStuffForJSFiles(code)\n}\n```\n\n### addScopedStyle\n\nTakes the css style passed in first argument, scopes it using the suffix and adds it to the current page.\n\n**prototype**: `addScopedStyle(css: string, suffix: string):void`\n\n### adaptCreateElement\n\nIn order to make JSX work with the compiler, you need to specify a pragma. Since tis pragma has a different form for VueJs than for ReactJs, we need to provide an adapter.\n\n```js\nimport { compile, adaptCreateElement } from 'vue-inbrowser-compiler'\n\n/**\n * render a JSX component\n */\nfunction getComponent(code) {\n const conpiledCode = compile(\n code,\n // in this config we set up the jsx pragma to a higher order function\n {\n jsx: '__pragma__(h)'\n }\n )\n const func = new Function('__pragma__', conpiledCode.script)\n // now pass the higher order function to the function call\n return func(adaptCreateElement)\n}\n```\n"
}

@@ -26,3 +26,3 @@ import * as path from 'path'

tsconfig: './tsconfig.build.json',
cacheDir: '../../node_modules/.rpt2_cache',
cacheDir: '../../node_modules/.rpt3_cache',
declarationDir: 'types',

@@ -29,0 +29,0 @@ rootDir: 'src'

import { Parser, Node } from 'acorn'
// @ts-ignore this type is defined in react-styleguidist
import jsx from 'acorn-jsx'
// eslint-disable-next-line @typescript-eslint/no-var-requires
const jsx = require('acorn-jsx')
const extendedParser = Parser.extend(jsx())

@@ -7,0 +6,0 @@

@@ -10,3 +10,3 @@ {

"include": ["src/**/*.ts"],
"exclude": ["src/**/__tests__/**/*.ts"]
"exclude": ["src/**/*.spec.ts"]
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc