Joker 前端 VSCODE 插件工程
该插件为 Joker 前端平台,VSCODE 语言解析工具,负责渲染 Joker 语法。
使用说明
支持 Joker 语法解析
支持 SFC 文件分块执行 LSP
内嵌 Typescript、Less、Sass 等语言的语法提示、错误等 lsp 基本功能
该插件是为了帮助 Joker 前端项目进行快速开发,需要配合 Joker 前端框架进行使用。
Examples
SFC 模板展示
<template>
<div>
我是Joker125336666内容1133:
<b>@model.date</b>
</div>
</template>
<script>
import { Component } from "@joker.joker/core";
export default class extends Component {
model = {
date: 0
};
mounted() {
setInterval(() => {
this.model.date++;
}, 1001);
}
}
</script>
<style lang="less" scoped>
div {
background: red;
b .aa {
color: #fff;
}
}
</style>
模板语法展示
<div>
@for (let i = 0; i < 数组.length; i++)
{
<p>@数组[i]</p>
}
@for(let index in 数组)
{
<p>suoyin :@index value: @数组[index]</p>
}
@for (let item of 对象)
{
<p>@item.a</p>
}
@for (let(index, item) in 数组)
{
<p>索引:@index 项:@item</p>
}
</div>
<ChildrenComponent @click="组件回执方法" prop1="@变量">
@section("id",内容参数1,内容参数2){
<p>内容参数1</p>
<p>@父组件变量</p>
}
</ChildrenComponent>
<!--内容部分-->
@RenderSection()
@RenderSection("id",@对外传参)
| |