今天晚上在技术交流群看到有小伙伴求助,说是有一个编程题,一看是ast相关的题目。我想之前学了ast都没怎么玩过,这不来个课后作业了吗?然后打开我的ide kuku写了一遍。毕竟是萌新嘛,就借助了AI帮忙写写。

这里依然请出我们的AI编程小助手:DeepSeek-Coder-V2

题目是,给一个对象,生成对应的TS代码:

1
2
3
4
5
6
{
"Pools": {
"requestType": "QueryPoolsRequest",
"responseType": "QueryPoolsResponse"
}
}

生成:

1
2
3
4
5
6
7
8
9
10
11
12
export interface UsePoolsQuery<TData> extends ReactQueryParams<QueryPoolsResponse, TData> {
request?: QueryPoolsRequest;
}
const usePools = <TData = QueryPoolsResponse,>({
request,
options
}: UsePoolsQuery<TData>) => {
return useQuery<QueryPoolsResponse, Error, TData>(["poolsQuery", request], () => {
if (!queryService) throw new Error("Query Service not initialized");
return queryService.pools(request);
}, options);
};
阅读全文 »

最近在跟着Rust语言圣经学Rust,但是学完之后根本记不住那么多类型,想重新回去记下笔记又发现很多类型分散在各章实在不好找。然后突然想到现在AI都这么强了,何不向AI这个好老师学习一下呢。然后我就掏出我平时常用的DeesSeek,这个是我觉得最强的国产AI了(懒得折腾GPT4捏而且免费又够用)。下面就顺手记下AI老师的教学吧,以供后面回来查阅。

阅读全文 »

前情提要:前段时间在用taro+unocss写项目,发现unocss更新了,然后满怀期待的更新到最新版本,然后问题就来了(悲)

遇到问题

当你将unocss更新到最新之后启动,你可能会看到如下报错:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
D:\xxx\node_modules\.pnpm\@unocss+config@0.60.2\node_modules\@unocss\config\dist\index.mjs:1
import { resolve, dirname } from 'node:path';
^^^^^^

SyntaxError: Cannot use import statement outside a module
at Object.compileFunction (node:vm:360:18)
at wrapSafe (node:internal/modules/cjs/loader:1124:15)
at Module._compile (node:internal/modules/cjs/loader:1160:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1250:10)
at Object.newLoader [as .mjs] (D:\projects\xxx\node_modules\.pnpm\pirates@4.0.6\node_modules\pirates\lib\index.js:121:7)
at Module.load (node:internal/modules/cjs/loader:1074:32)
at Function.Module._load (node:internal/modules/cjs/loader:909:12)
at Module.require (node:internal/modules/cjs/loader:1098:19)
at require (node:internal/modules/cjs/helpers:108:18)
at Object.<anonymous> (D:\projects\xxx\node_modules\.pnpm\@unocss+webpack@0.60.2_webpack@5.91.0\node_modules\@unocss\webpack\dist\index.cjs:10:16)
D:\projects\xxx:
 ERR_PNPM_RECURSIVE_RUN_FIRST_FAIL  xxx@0.0.1 dev:weapp: `npm run build:weapp -- --watch --env production`
Exit status 1

经过查看unocss的源码和commit可以得知,新版本去掉了cjs打包,而我们的taro项目还是用的cjs模式,然后尝试将package.json切换到esm模式,又出现了别的报错!(悲)

在搜索taro的issue列表没发现其他人提到之后,无奈之下只能提交issue到taro的仓库看看有没有解决办法,然后切回旧版本用着。

几天之后,收到一位小伙伴提供的解决方案(应该是taro的维护者),他提到这样去解决:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// 在配置文件index.js
import { createSwcRegister, getModuleDefaultExport } from '@tarojs/helper';

const config = {
mini: {
webpackChain(chain) {
createSwcRegister({
only: [filePath => filePath.includes('@unocss')]
});
const UnoCSS = getModuleDefaultExport(require('@unocss/webpack'));
chain.plugin('unocss').use(UnoCSS());
);
}
},
h5: {// 同上操作}
}

然后运行,神奇的运行起来了!!!

解决原理

本着打破砂锅问到底的精神,我想去研究一下到底大概是什么原理,我找到了@taro/helper这个包的源码,其中:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
//https://github.com/NervJS/taro/blob/main/packages/taro-helper/src/swcRegister.ts
export default function createSwcRegister ({ only, plugins }: ICreateSwcRegisterParam) {
const config: Record<string, any> = {
only: Array.from(new Set([...only])),
jsc: {
parser: {
syntax: 'typescript',
decorators: true
},
transform: {
legacyDecorator: true
}
},
module: {
type: 'commonjs'
}
}

if (plugins) {
config.jsc.experimental = {
plugins
}
}

require('@swc/register')(config)
}

// https://github.com/NervJS/taro/blob/main/packages/taro-helper/src/utils.ts
export const getModuleDefaultExport = exports => exports.__esModule ? exports.default : exports

看起来一个函数是创建SwcRegister,另一个是判断是否esm模块再获取匿名导出。

创建SwcRegister函数的主要逻辑只是在接受一下参数和设置一下默认参数,看起来是使用ts解析器将源码转译成cjs代码,然后调用了一下@swc/register,然后我就去npm看了一下这个包是干啥的。

可以看到它的介绍:One of the ways you can use swc is through the require hook. The require hook will bind itself to node’s require and automatically compile files on the fly.使用swc的一种方法是通过require钩子。require钩子将自己绑定到node的require,并自动动态编译文件。

很直白了,就是我们使用require的时候,使用swc将代码转译一下再运行。

再简单耍一下这个工具

为了尝试一下这个工具是不是真的能编译ts成cjs,我们创建个空白文件夹:

1
2
pnpm init
pnpm add @swc/register

创建一个ts文件:

1
2
// lib.ts
export const add = (a: number, b: number) => a + b
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
const config = {
only: [() => true], // 简单的设置成全部编译
jsc: {
parser: {
syntax: 'typescript',
decorators: true,
},
transform: {
legacyDecorator: true,
},
},
module: {
type: 'commonjs',
},
}

require('@swc/register')(config)

const { add } = require('./lib')

console.log(add(1, 2))

执行 node main.js ,命令行正常输出 3 !nice,完美运行!

这下妈妈再也不怕别的包支持cjs啦!

今天晚上看托尼老师的直播提到了这个东西,感觉有点意思,就记录一下吧

原文:Introducing ESLint Config Inspector

这是一个帮助您理解和检查 ESLint 扁平配置文件的可视化工具。

截至 ESLint v9.0.0,新的配置系统已经达到通用可用性,带来了许多好处。配置文件现在更容易管理和更透明地组合。然而,当您的配置复杂或来自多个来源时,了解哪些规则对特定文件启用和禁用仍然可能不简单。这就是为什么我们很高兴地介绍 ESLint 配置检查器,这是一个可视化和交互式工具,帮助您更好地理解和检查您的配置文件。

阅读全文 »

原文来自JetBrains公众号:使用 Rocket 和 RustRover 编写您的第一个 Rust Web 应用 | 实用教程

如果您像我一样刚刚开始使用 Rust,您的经验可能部分或绝大部分来自于其他生态系统。面对引起热议的 Rust 新技术堆栈,您也许会感觉无从下手。别担心, 我们特别为您准备了一份教程。在这篇博文中,我们将使用 Rocket 库构建一个在 Rust 后端上运行的简单 HTML Web 应用程序。

首先,下载我们专为 Rust 社区设计的最新 IDE RustRover。您也需要使用 RustRover 或社区入门指南安装 Rust。

在本教程结尾,我们将得到一个托管静态文件的 Web 应用程序、一个具有多个端点的应用程序、服务器端模板渲染、闪现消息传递和请求/响应流。我们先来看将使用的库,然后再深入研究构建示例应用程序的细节。

阅读全文 »
0%