1. weex-transformer
Weex DSL transformer
weex-transformer
Package: weex-transformer
Created by: weexteam
Last modified: Wed, 29 Jun 2022 00:53:02 GMT
Version: 0.4.6
License: MIT
Downloads: 448
Repository: https://github.com/weexteam/weex-transformer

Install

npm install weex-transformer
yarn add weex-transformer

Weex DSL Transformer

NPM version
Build status
Downloads

<template> + <style> + <script> + <element>

Install

 npm install weex-transformer

Usage

CLI tool

  Usage: transformer [options] <file...>

  Options:

    -h, --help               output usage information
    -V, --version            output the version number
    -g, --logLevel [value]   specify log output level - `NOTE`, `WARNING`, `ERROR`, `OFF` (default: `NOTE`, equivalent to `ALL`)
    -e, --isEntry [value]    whether is an entry module which has `bootstrap` (default: true)
    -l, --oldFormat [value]  whether to transform to old format (default: false)
    -o, --output [path]      the output file dirname

API

transform(name, code, path, elements, config)

 var transformer = require('weex-transformer')
var output = transformer.transform('foo', '/* code here */', '.', {})
params
  • name: string, current bundle name
  • code: string, source code
  • path: string optional, useful when find custom component in a certain path
  • elements: object optional, existed custom component map
  • config: object optional
    • logLevel: specify log output level - NOTE (default, equivalent to ALL), WARNING, ERROR, OFF, aranging from low to high
    • isEntry: whether is an entry module which has bootstrap (default: true)
    • oldFormat: whether to transform to old format (default: false)
returns
  • an object with keys
    • result: string, all custom components define() and final bootstrap()
    • logs: array, corresponding warning & error logs

transformOld(...)

same params and different output format for old style: register(name, options) and render(name, data)

transforming content

  • template: JavaScript Object by parse5
  • style: JSON Object by css
  • script: JavaScript AST with template, deps, style by esprima
  • element: string code map for deeply parsing

workflow

  1. get template, style, script, elements
  2. parse and validate style by styler
  3. parse and validate template by templater and get deps
  4. parse script by scripter
  5. join template, style and script to build a module
  6. collect element code map
  7. output define() string code, deps, element code map and logs
  8. find deps code by name from element code map first and from file system for second
  9. join all deps code together recursively
  10. find all required 3rd party javascript and bundle them
  11. append bootstrap() string code and bundle at last

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code