summaryrefslogtreecommitdiff
path: root/2024
diff options
context:
space:
mode:
Diffstat (limited to '2024')
-rw-r--r--2024/05/16/二〇二四年五月十六日/index.html5
-rw-r--r--2024/05/20/Rescript-genType-import-问题/index.html284
2 files changed, 289 insertions, 0 deletions
diff --git a/2024/05/16/二〇二四年五月十六日/index.html b/2024/05/16/二〇二四年五月十六日/index.html
index dc6ce062..a12d72aa 100644
--- a/2024/05/16/二〇二四年五月十六日/index.html
+++ b/2024/05/16/二〇二四年五月十六日/index.html
@@ -183,6 +183,11 @@
<nav class="post-nav">
<div class="prev-item">
+ <div class="icon arrow-left"></div>
+ <div class="post-link">
+ <a href="/2024/05/20/Rescript-genType-import-%E9%97%AE%E9%A2%98/">Prev</a>
+ </div>
+
</div>
<div class="next-item">
diff --git a/2024/05/20/Rescript-genType-import-问题/index.html b/2024/05/20/Rescript-genType-import-问题/index.html
new file mode 100644
index 00000000..abc3f898
--- /dev/null
+++ b/2024/05/20/Rescript-genType-import-问题/index.html
@@ -0,0 +1,284 @@
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8">
+<meta name="viewport"
+ content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+<meta http-equiv="X-UA-Compatible" content="ie=edge">
+
+ <meta name="author" content="韩暮秋">
+
+
+ <meta name="subtitle" content="暮秋小屋">
+
+
+ <meta name="description" content="这里是暮秋小屋，思念和灵感的寄存处">
+
+
+ <meta name="keywords" content="韩暮秋,MuqiuHan,'Muqiu Han', 'muqiu han', muqiuhan">
+
+
+
+
+<title>Rescript @genType import 问题 | 暮秋小屋</title>
+
+
+
+ <link rel="icon" href="/favicon.ico">
+
+
+
+<style>
+ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;700&family=Roboto+Mono&display=swap');
+</style>
+
+
+
+ <!-- stylesheets list from _config.yml -->
+
+ <link rel="stylesheet" href="/css/style.css">
+
+
+
+
+
+ <!-- scripts list from _config.yml -->
+
+ <script src="/js/frame.js"></script>
+
+
+
+
+
+ <script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
+ <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
+
+
+
+
+
+
+
+ <meta name="generator" content="Hexo 6.3.0"></head>
+ <body>
+ <div class="mask-border">
+ </div>
+
+ <div class="wrapper">
+
+ <div class="header">
+ <div class="flex-container">
+ <div class="header-inner">
+ <div class="site-brand-container">
+ <a href="/">
+
+ <img class="logo-img" src="/logo.ico" alt="logo_image">
+
+ </a>
+ </div>
+ <div id="menu-btn" class="menu-btn" onclick="toggleMenu()">
+ Menu
+ </div>
+ <nav class="site-nav">
+ <ul class="menu-list">
+
+
+ <li class="menu-item">
+ <a href="/">主页</a>
+ </li>
+
+
+
+ <li class="menu-item">
+ <a href="/categories/gallery/">日记本</a>
+ </li>
+
+
+
+ <li class="menu-item">
+ <a href="/tags/Medicine/">医学</a>
+ </li>
+
+
+
+ <li class="menu-item">
+ <a href="/tags/Technique/">计算机科学</a>
+ </li>
+
+
+
+ <li class="menu-item">
+ <a href="/tags/Life/">生活</a>
+ </li>
+
+
+
+ <li class="menu-item">
+ <a href="/about">关于</a>
+ </li>
+
+
+
+ <li class="menu-item search-btn">
+ <a href="#">Search</a>
+ </li>
+
+ </ul>
+ </nav>
+ </div>
+ </div>
+</div>
+
+
+ <div class="main">
+ <div class="flex-container">
+ <article id="post">
+
+
+ <div class="post-head">
+ <div class="post-info">
+ <div class="tag-list">
+
+
+ <span class="post-tag">
+ <a href="/tags/Technique/">
+ Technique
+ </a>
+ </span>
+
+ <span class="post-tag">
+ <a href="/tags/Rescript/">
+ Rescript
+ </a>
+ </span>
+
+
+ </div>
+ <div class="post-title">
+
+
+ Rescript @genType import 问题
+
+
+ </div>
+ <span class="post-date">
+ May 20, 2024
+ </span>
+ </div>
+ <div class="post-img">
+
+ <div class="h-line-primary"></div>
+
+ </div>
+</div>
+ <div class="post-content">
+ <p>Rescript 11 之后，<code>@genType</code> 被合并进编译器，无需任何依赖就能使用，当在 Rescript 中 <code>@genType</code> 了使用某些 Rescript built-in 的基本类型时，可能会生成有问题的 <code>import</code> 相关代码，例如：</p>
+<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br></pre></td><td class="code"><pre><span class="line">@genType</span><br><span class="line">module LoginResponse = &#123;</span><br><span class="line"> let status = response =&gt; &#123;</span><br><span class="line"> response</span><br><span class="line"> -&gt;Js.Json.decodeObject</span><br><span class="line"> -&gt;Option.flatMap(response =&gt; &#123;</span><br><span class="line"> response-&gt;Js_dict.get(&quot;status&quot;)</span><br><span class="line"> &#125;)</span><br><span class="line"> &#125;</span><br><span class="line">&#125;</span><br></pre></td></tr></table></figure>
+
+<p><code>status</code> 函数具有 <code>Js.Json.t =&gt; option&lt;Js.Json.t&gt;</code> 类型，那么在生成的 TypeScript 文件中，会出现这样的 import:</p>
+<figure class="highlight typescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">import</span> <span class="keyword">type</span> &#123; <span class="title class_">Json</span>_t <span class="keyword">as</span> <span class="title class_">Js</span>_Json_t &#125; <span class="keyword">from</span> <span class="string">&quot;./Js.gen.tsx&quot;</span></span><br></pre></td></tr></table></figure>
+
+<p>而 <code>Js.gen.tsx</code> 这个文件是不存在的，解决方案是使用 <code>@genType</code> 的 <code>shim</code>：</p>
+<ul>
+<li><p>在 <code>rescript.json</code> 中的 <code>gentypeconfig</code> 中添加 <code>shim</code> 配置:</p>
+<figure class="highlight json"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br></pre></td><td class="code"><pre><span class="line">...</span><br><span class="line"><span class="attr">&quot;gentypeconfig&quot;</span><span class="punctuation">:</span> <span class="punctuation">&#123;</span></span><br><span class="line">...</span><br><span class="line"> <span class="attr">&quot;shims&quot;</span><span class="punctuation">:</span> <span class="punctuation">&#123;</span></span><br><span class="line"> <span class="attr">&quot;Js&quot;</span><span class="punctuation">:</span> <span class="string">&quot;Js&quot;</span></span><br><span class="line"> <span class="punctuation">&#125;</span><span class="punctuation">,</span></span><br><span class="line">...</span><br><span class="line"><span class="punctuation">&#125;</span></span><br><span class="line">...</span><br></pre></td></tr></table></figure>
+</li>
+<li><p>然后新建 <code>Js.shim.ts</code>:</p>
+<figure class="highlight typescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">export</span> <span class="keyword">type</span> <span class="title class_">Json</span>_t = <span class="built_in">unknown</span>;</span><br><span class="line"></span><br><span class="line"><span class="keyword">export</span> <span class="keyword">type</span> t = <span class="built_in">unknown</span>;</span><br><span class="line"></span><br><span class="line"><span class="keyword">export</span> <span class="keyword">type</span> <span class="title class_">Exn</span>_t = <span class="title class_">Error</span>;</span><br></pre></td></tr></table></figure>
+</li>
+<li><p>删除原来由 <code>@genType</code> 生成的 TypeScript 文件并重新生成</p>
+</li>
+</ul>
+<p>现在生成的 TypeScript 文件将会从 <code>Js.shim.ts</code> import 类型:</p>
+<figure class="highlight typescript"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line"><span class="keyword">import</span> <span class="keyword">type</span> &#123;<span class="title class_">Json</span>_t <span class="keyword">as</span> <span class="title class_">Js</span>_Json_t&#125; <span class="keyword">from</span> <span class="string">&#x27;../../src/model/Js.shim.ts&#x27;</span>;</span><br></pre></td></tr></table></figure>
+
+</div>
+
+<script>
+ window.onload = detectors();
+</script>
+ <div class="post-footer">
+ <div class="h-line-primary"></div>
+ <nav class="post-nav">
+ <div class="prev-item">
+
+ </div>
+ <div class="next-item">
+
+ <div class="icon arrow-right"></div>
+ <div class="post-link">
+ <a href="/2024/05/16/%E4%BA%8C%E3%80%87%E4%BA%8C%E5%9B%9B%E5%B9%B4%E4%BA%94%E6%9C%88%E5%8D%81%E5%85%AD%E6%97%A5/">Next</a>
+ </div>
+
+ </div>
+ </nav>
+</div>
+
+
+ <div class="post-comment">
+
+
+
+
+
+
+
+</div>
+
+
+</article>
+ </div>
+ </div>
+
+ <div class="footer">
+ <div class="flex-container">
+ <div class="footer-text">
+
+
+ |
+
+
+ 希望路过的人可以添点柴火让这里暖和点
+
+ </div>
+ </div>
+</div>
+
+ </div>
+
+
+ <div class="search-popup">
+ <div class="search-popup-overlay">
+ </div>
+ <div class="search-popup-window" >
+ <div class="search-header">
+ <div class="search-input-container">
+ <input autocomplete="off" autocapitalize="off" maxlength="80"
+ placeholder="Search Anything" spellcheck="false"
+ type="search" class="search-input">
+ </div>
+ <div class="search-close-btn">
+ <div class="icon close-btn"></div>
+ </div>
+ </div>
+ <div class="search-result-container">
+ </div>
+ </div>
+</div>
+
+<script>
+ const searchConfig = {
+ path : "/search.xml",
+ top_n_per_article: "1",
+ unescape : "false",
+ trigger: "auto",
+ preload: "false"
+ }
+</script>
+<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/search.js"></script>
+<script src="/js/search.js"></script>
+
+
+
+ </body>
+</html>
generated by cgit v1.2.3 (git 2.39.1) at 2026-10-04 13:36:17 +0000