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

babel-plugin-transform-solid-jsx

Package Overview
Dependencies
Maintainers
0
Versions
116
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

babel-plugin-transform-solid-jsx

A JSX to DOM plugin that wraps expressions for fine grained change detection

  • 4.0.5-alpha.7
  • Source
  • npm
  • Socket score

Version published
Maintainers
0
Created
Source

babel-plugin-transform-solid-jsx

fork from babel-plugin-jsx-dom-expressions version: 0.37.19

This package is a JSX compiler built for DOM Expressions to provide a general JSX to DOM transformation for reactive libraries that do fine grained change detection. This package aims to convert JSX statements to native DOM statements and wrap JSX expressions with functions that can be implemented with the library of your choice. Sort of like a JSX to Hyperscript for fine change detection.

What Has Been Modified?

  • Added uniqueTransform configuration, defaulting to false, indicating that the following processing should not be performed.
  • Within the transformElement function of the universal module, perform matching against components from @tarojs/components. Modify the transformation of these components such that they are instead invoked via createElement calls.

Example

import { View, Text, Button } from '@tarojs/components';

const Component = () => {
  return (
    <View class="index">
      <View>
        <Text>Hello world! </Text>
      </View>
      <Button>set class</Button>
    </View>
  );
};

Compiles to:

import { createTextNode as _$createTextNode } from "@tarojs/plugin-framework-react/dist/reconciler";
import { insertNode as _$insertNode } from "@tarojs/plugin-framework-react/dist/reconciler";
import { setProp as _$setProp } from "@tarojs/plugin-framework-react/dist/reconciler";
import { createElement as _$createElement } from "@tarojs/plugin-framework-react/dist/reconciler";
import { View, Text, Button } from "@tarojs/components";
export default function Index() {
  return function () {
    var _el$ = _$createElement("view"),
      _el$2 = _$createElement("view"),
      _el$3 = _$createElement("text"),
      _el$5 = _$createElement("button");
    _$insertNode(_el$, _el$2);
    _$insertNode(_el$, _el$5);
    _$setProp(_el$, "class", "index");
    _$insertNode(_el$2, _el$3);
    _$insertNode(_el$3, _$createTextNode("Hello world! "));
    _$insertNode(_el$5, _$createTextNode("set class"));
    return _el$;
  }();
}

The purpose of doing so is to ensure compatibility by aligning the compilation results of Taro components within mini programs with those of original tags.

FAQs

Package last updated on 14 Aug 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

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