V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
vision1900
V2EX  ›  JavaScript

前端如何获得某个函数的完全实现?

  •  
  •   vision1900 · 2022-09-06 19:05:10 +08:00 · 2285 次点击
    这是一个创建于 807 天前的主题,其中的信息可能已经有所发展或是发生改变。

    项目中前端实现了某个复杂的渲染逻辑(渲染的结果是字符串,可以理解是多字段的复杂组装),现在要把这个渲染逻辑挪到后端

    由于渲染逻辑比较复杂,如果后端独立实现这个渲染逻辑,相当于一件事情做了两遍,未免太花时间

    所以现在需要把前端的渲染逻辑整理一下,直接把相关函数给到后端使用

    但是前端这个函数调用了其他的好多子函数,试了一下直接使用 Function.prototype.toString,但结果并不能包含它所依赖的子函数的函数体。

    想来请教下前端如何能够能够完整的输出这个渲染函数呢?可以是一个巨大无比的函数,也可以是一个文件里面好多函数,但要保证函数间的依赖完整

    FYI: 前端用的是 webpack 做打包,语言是 typescript

    12 条回复    2022-09-06 21:47:16 +08:00
    vision1900
        1
    vision1900  
    OP
       2022-09-06 19:07:32 +08:00
    后端用的也是 JS ,所以可以直接调用
    lisongeee
        2
    lisongeee  
       2022-09-06 19:08:08 +08:00
    如果有递归调用,你准备如何转这个函数的字符串呢?
    zcf0508
        3
    zcf0508  
       2022-09-06 19:11:08 +08:00 via Android
    单独写一个入口让 webpack 打包呢
    DOLLOR
        4
    DOLLOR  
       2022-09-06 19:14:17 +08:00
    既然前后端都用 JS ,都是 ES 模块,那么直接把代码拷过去不行?
    fstar
        5
    fstar  
       2022-09-06 19:14:41 +08:00
    做成 monorepo 吧,或者把公用的代码做成一个 npm 包
    Envov
        6
    Envov  
       2022-09-06 19:18:46 +08:00
    不知道你们 webpack 是怎么配置的,如果有配置文件可以在哪个文件的基础上把 webpack 的入口和出口改一下就可以把那个函数单独编译出来了
    ```
    //webpack.config.js
    module.exports = {
    entry: './src/function-name.js'
    output: {
    filename: 'function-name.js',
    },
    };

    ```
    npx webpack build --config ./webpack.config.js --stats verbose
    zckevin
        7
    zckevin  
       2022-09-06 19:19:17 +08:00
    同样也是爬虫行业的难题之一
    vision1900
        8
    vision1900  
    OP
       2022-09-06 19:36:34 +08:00
    @zcf0508 @Envov 这个应该可行
    vision1900
        9
    vision1900  
    OP
       2022-09-06 19:39:16 +08:00
    @DOLLOR 这个可能是保持代码可读性和模块化最好的方法,但是函数可能有多层依赖,手动去把依赖关系理清有点费时间。况且前端用的某个 npm 包后端可能没安装也不想安装
    vision1900
        10
    vision1900  
    OP
       2022-09-06 19:43:39 +08:00
    @fstar monorepo 花费的精力太大,前后端一直是完全分离的,不同的人负责。发布 npm pacakge 同样面临把这些函数(可能是多层依赖)手动挑出来的过程
    zhw2590582
        11
    zhw2590582  
       2022-09-06 21:27:49 +08:00
    除了手动去分离出来,我也想不出更好的办法了
    musi
        12
    musi  
       2022-09-06 21:47:16 +08:00
    为了后面的可维护性感觉还是拆出去比较好
    万一前端哪天动了其中的一个依赖,用的是浏览器宿主环境的方法
    这时候你在放到 node 里跑就报错了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2151 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 16:13 · PVG 00:13 · LAX 08:13 · JFK 11:13
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.