こんにちは@zekth！

これからのdenoであなたが持っているエキサイティングな計画。 私はこのプロジェクトのESモジュールに互換性を持たせることに非常に前向きであり、移植を回避することについてのあなたの考えに完全に同意します。

これを実現するために何が必要か、具体的な考えはありますか？

これが私が今朝行った（本当に醜い）ポートです（typescriptで） https://github.com/zekth/deno_mustache/blob/master/mod.ts

私は最初にいくつかのテストを移植しました。
私が持っている唯一の懸念は、あなたが口ひげでサポートするすべての異なる環境です。メインのjsファイルESモジュールと互換性があることは、私が思う別のmjsよりも優れていますが、私は何も壊したくないです:)

参照ありがとうございます！ 👍

私はdenoの経験がまったくないので、いくつかの些細な質問を解き放ち、いくつかの議論を引き起こします。

1. これを機能させるには、どのような要件を否定する必要がありますか？ .mjsファイルである必要がありますか、それともpackage.jsonの
2. ファイルの命名要件はありますか？
3. TypeScriptはここでどういうわけか重要ですか？

..など、ダミーの手がかりをいただければ幸いです。 現時点では、これに取り組むためのもっともらしい方法について創造的に考えるには、denoについての知識が少なすぎます。

1. ライブラリがESモジュールである必要があるだけなので、特別な要件はありません。 例lodashは、移植なしで機能します。 モジュールのロードは、HTTPフェッチを介して行われ、パッケージjsonなどは行われません。
2. 命名規則なし
3. JavaScriptのTypeScriptを使用でき、Denoは両方を処理します。

たとえば、denoで口ひげを使用すると次のようになります。

import * as mustache from 'https://raw.githubusercontent.com/janl/mustache.js/master/mustache.js'
mustache.render(......

さらに詳しい情報が必要な場合は、ライアンからのこのトークを確認できます： https ：

涼しい！

それで、ここにいくつかの考えと文脈を共有するためのいくつかのとりとめのないものがあります。 ESモジュールについての私の理解は、それらがexport edの観点から構文解析可能であることを意図しているということです。 これは、CommonJS、AMDなど、本質的にはるかに動的なその前身とは対照的です。

そのことを念頭に置いて、今日、 mustache.jsの本体を取り巻くIIFEは、コードが現在実行されているモジュールシステムを機能検出することを目的としており、ESモジュールランドでは機能しないと想定しています。 m間違っています！

つまり、ポートにあるような単純で単純なexport ...を持つ.js | .mjs | .tsファイルが必要です： zekth / deno_mustache / mod.ts＃L689 。

楽しみは、古い動作を維持し、他のモジュールシステムを使用するプロジェクトとの互換性を維持したい場合、またはモジュールシステムをまったく使用しない場合から始まります。したがって、前述のIIFEラッパーが必要です。サーバーとブラウザで実行されます。

確かに、2つの異なる実装（ESモジュールと残りの部分）の同期を維持したくないので、ビルドステップを検討する価値があると感じ始めます。 たとえば、ソースコードをESモジュールスタイルで記述した場合、ビルドステップで現在のように非ESモジュールに変換できます。 または、それがあまり邪魔にならない場合は、その逆です。

最後に、私は可能な限り小さなステップを実行するのが大好きです。 私は一般的にTypeScriptに前向きですが、ESモジュールに焦点を合わせ続け、TypeScript / export typedefsに変換するかどうかに焦点を当てた別のラウンドを行う場合、今のところ大丈夫ですか？

頭に浮かぶ他の考えや修正はありますか？

正解です。最初のステップは、TypeScriptスタックを追加し、コンパイラーを使用してcommonjs / ES5 / ES6などの複数のファイルを出力することです（https://www.typescriptlang.org/docs/handbook/compiler-options .html）。 TSコンパイラを使用しても、TypeScriptを使用する必要はありません。また、ES6コードを使用することもできます。

ああ、それは素晴らしい提案です！ 最初は、TSコンパイラをES->他のモジュールシステムからの通常のビルドツールとして使用しようとしています。 これにより、後でもっともらしいTS変換のリスクが大幅に低下します。

そのアプローチを試してみることができますか？ 必ずしもすべてを一度に解決する必要はありませんが、少なくとも最初の構成要素です。 何か具体的なものを見て、将来の議論の基礎となることが本当に価値があるでしょう。

Sooo私はESモジュールに移行することに挑戦しました。

私の概念実証は、主にそれらが生成するUMDバージョンのために、TypeScriptコンパイラ（またはbabel）の代わりにrollup.jsを使用することになりました-古いモジュールシステムとの互換性を維持するか、モジュールシステムをまったく使用しないためにそれが必要です。

denoを使用してテストを実行し、期待どおりに機能するかどうかを確認する機会はありますか？ phillipj / mustache.js＃esm-mustache.mjsを確認する

@phillipjがやる！

いくつかのエラーがありますが、それらはマイナーな修正だと思います。

error TS2339: Property 'render' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► file:///Users/vlegoff/projects/genesys/github/telemetry/t/mustache.ts:10:23

10 var output = mustache.render('{{title}} spends {{calc}}', view);
                         ~~~~~~

error TS2554: Expected 2 arguments, but got 1.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:525:52

525   var context = (view instanceof Context) ? view : new Context(view);
                                                       ~~~~~~~~~~~~~~~~~

  An argument for 'parentContext' was not provided.

    ► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:377:25

    377 function Context (view, parentContext) {
                                ~~~~~~~~~~~~~


error TS2339: Property 'escape' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:640:21

640     return mustache.escape(value);
                        ~~~~~~

error TS2339: Property 'clearCache' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:659:10

659 mustache.clearCache = function clearCache () {
             ~~~~~~~~~~

error TS2339: Property 'parse' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:668:10

668 mustache.parse = function parse (template, tags) {
             ~~~~~

error TS2339: Property 'render' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:678:10

678 mustache.render = function render (template, view, partials, tags) {
             ~~~~~~

error TS2339: Property 'to_html' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:690:10

690 mustache.to_html = function to_html (template, view, partials, send) {
             ~~~~~~~

error TS2339: Property 'render' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:693:25

693   var result = mustache.render(template, view, partials);
                            ~~~~~~

error TS2339: Property 'escape' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:704:10

704 mustache.escape = escapeHtml;
             ~~~~~~

error TS2339: Property 'Scanner' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:707:10

707 mustache.Scanner = Scanner;
             ~~~~~~~

error TS2339: Property 'Context' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:708:10

708 mustache.Context = Context;
             ~~~~~~~

error TS2339: Property 'Writer' does not exist on type '{ name: string; version: string; tags: string[]; }'.

► https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs:709:10

709 mustache.Writer = Writer;
             ~~~~~~


Found 12 errors.

コード：

import mustache from 'https://raw.githubusercontent.com/phillipj/mustache.js/esm-ify/mustache.mjs';

var view = {
  title: 'Joe',
  calc: function() {
    return 2 + 4;
  },
};

var output = mustache.render('{{title}} spends {{calc}}', view);

console.log(output);

.mjsファイルにPRを作成してみませんか？

ありがとう！

申し訳ありませんが、最初にやろうとしたことについてもう少しコンテキストを共有する必要があることに気づきました。

前に説明したように、TypeScriptコンパイラを最初に試したところ、かなりの数のエラーが発生しました。これは、現在提供しているものと多少似ています。 それにもかかわらず、それが出力を生成し、それが私が望んでいたものに非常に近いことに驚いた。

私が満足しなかったのは、コンパイルされた出力をラップしたUMDコードでした。 主に2つのこと：

1. パッケージの内容をグローバルスコープに公開するというフォールバックはありません（ window.Mustache考えてください）。 これは、モジュールシステムを導入していないユーザーにとって非常に重要です。
2. CommonJSのプロジェクトでは、このパッケージの内容は以下のように公開されたmodule.exports.defaultではなくmodule.exports 。 CommonJS require()がESモジュールである場合、これは正しく予想される動作である可能性がありますが、回避したいと思っていた下位互換性が失われます。

私の主な目標は、TypeScriptを導入するのではなく、何よりもまずソースコードをESモジュールに移行することだったので、上記の2つの課題を回避するために、さまざまなコンパイラ/バンドルを試して、動作が異なるかどうかを確認することにしました。

したがって、私がrollup.jsを使用することになった理由。 UMD出力は私たちが必要としているものであり、このパッケージのユーザーに重大な変更を引き起こすことはありません。

私の実際の質問にすっごく。 現時点でTypeScriptを気にする必要がありますか？

この議論の前半からの私の理解は、TypeScriptに完全に移行することはまだ考えられないということdenoそれでも、それが実際にESモジュールである場合は、 denoですが、少し誤解したかもしれません。

主な問題は、ここのような口ひげの最初の初期化だと思います：
https://github.com/janl/mustache.js/blob/master/mustache.js#L14

また、これ： https ：
new Context(view, null)と書き直すことができます

思いませんか？

主な問題は口ひげの最初の初期化だと思います。

あなたはおそらく正しいです。 .mjsバージョンでは、UMDラッパーから渡されるオブジェクトではなく、少なくとも実際のソースコードに移動してみました。

var mustache = {
  name: 'mustache.js',
  version: version,
  tags: [ '{{', '}}' ]
}

それらのTypeScriptエラーを修正するあなたのアプローチを見るのはクールでしょう👍

新しいContext（view、null）として書き換えることができます

ほとんど.. new Context(view, undefined)は、2番目の引数をまったく渡さないのと同じではありませんか？

はい、 new Contextについては正解です

私は何かを試してみます:)

PRは次のとおりです： https ：
CIが壊れていますが、なぜこれらのリンティングメッセージを受け取ったのかわかりません

素晴らしい、どうもありがとう！ 次の数日はかなり忙しいので、週が終わる前に確認するために最善を尽くします。

状況更新; esm-ifyブランチに対して開いたPRで述べたように、このパッケージが＃724で長年サポートしてきたさまざまなモジュールシステムで意図したとおりに機能することを確認するためのテストをいくつか実施しました。

誰かが異議を唱えたり、さらに微調整したりする場合に備えて、いくつかの改善をプッシュしたので、数日間その醸造を許可します。

これらのテストが実施されたので、このプロジェクトをESモジュールとして記述し、今日のmustache.js得たものを生成するためのビルドステップに移行することを快適に感じています。もちろん、これは実行されます。今後のPRで。

728は公の精査のために開かれました。