V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
zeyexe
V2EX  ›  Node.js

想在 vue/webpack HMR 触发 reload 的时候执行一个脚本应该怎么做?

  •  
  •   zeyexe · 2019-04-18 08:39:15 +08:00 · 4777 次点击
    这是一个创建于 2045 天前的主题,其中的信息可能已经有所发展或是发生改变。
    请教大家一个 vue/webpack 的问题。

    我现在在用 vue 开发一个项目,想要每次修改一个 json 文件的时候通过一个 js 脚本从这个 json 文件生成另外两个 json 文件放到 public 目录中,应该怎么做?

    我理解这可能需要把这个 js 脚本改造成一个 loader。不知道有没有现成的解决方案?
    12 条回复    2019-05-07 19:37:18 +08:00
    IsaacYoung
        1
    IsaacYoung  
       2019-04-18 08:41:43 +08:00 via iPhone   ❤️ 1
    fs.watch
    zeyexe
        2
    zeyexe  
    OP
       2019-04-18 08:54:10 +08:00
    @IsaacYoung #1 能不能具体说说应该怎么做。我这个需求感觉类似是一次编译,就像把 less 编译成 css 并保存,我是要把 1 个 json 编译成 2 个 json 并保存。
    TomVista
        3
    TomVista  
       2019-04-18 09:02:51 +08:00   ❤️ 1
    Chokidar。chokidar 是一个基于 node.JS 的监听文件夹改变模块
    node 本身能够执行 js 脚本.
    node 下 fs 模块,是一个文件系统.

    以上 3 点完全能够支撑这个需求.
    TomVista
        4
    TomVista  
       2019-04-18 09:03:52 +08:00   ❤️ 1
    1 楼提到的 fs.watch 也能实现文件监听,Chokidar 只是封装了下.
    zeyexe
        5
    zeyexe  
    OP
       2019-04-18 09:18:08 +08:00
    @TomVista #4 文件监听 webpack 本身就有的功能,监听应该不是问题。我主要是想做一个 hook,想要让 webpack 在文件发生变化时自动执行一个脚本。
    airyland
        6
    airyland  
       2019-04-18 09:19:06 +08:00   ❤️ 1
    在 webpack 中实现的话写个 loader 来处理,配置 rule match 到这个文件,好处是不用另开个命令行。不用 webpack 的话如上面写个文件 watch。
    binshao54
        7
    binshao54  
       2019-04-18 09:19:54 +08:00   ❤️ 1
    用 express 中间件 webpack-dev-middleware , 可以拿到 webpack 的 compiler 实例, 监听 compiler.watch 事件不知道能不能解决
    jin5354
        8
    jin5354  
       2019-04-18 09:22:31 +08:00   ❤️ 1
    写个 loader 是最简单的。配置 match 让这个 json 过这个 loader,loader 不处理内容只用副作用生成文件。
    TomVista
        9
    TomVista  
       2019-04-18 09:30:30 +08:00   ❤️ 1
    https://www.webpackjs.com/api/compiler-hooks/ 把你的 js 脚本扔到 webpack 钩子里,,你自己看看那个钩子合适.
    otakustay
        10
    otakustay  
       2019-04-18 10:36:52 +08:00   ❤️ 1
    写个 webpack 的插件呗
    sunzongzheng
        11
    sunzongzheng  
       2019-04-18 19:36:34 +08:00 via Android   ❤️ 1
    webpck-nodemon
    cjc2017
        12
    cjc2017  
       2019-05-07 19:37:18 +08:00 via iPhone
    @TomVista 感觉这位老哥方案比较稳
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   933 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 22:25 · PVG 06:25 · LAX 14:25 · JFK 17:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.