Handlebars.js: webpack +ハンドルバーが必要エラー

作成日 2016年01月26日  ·  21コメント  ·  ソース: handlebars-lang/handlebars.js

requireハンドルバーを使用するだけで次のエラーが発生します。

▶ webpack --display-modules   
Hash: bdb0fe35e2f8bde783e5
Version: webpack 1.12.12
Time: 116ms
         Asset     Size  Chunks             Chunk Names
bundle.main.js  2.82 kB       0  [emitted]  main
   [0] ./src/index.js 150 bytes {0} [built]
   [1] ./~/handlebars/lib/index.js 792 bytes {0} [built] [3 warnings] [3 errors]

WARNING in ./~/handlebars/lib/index.js
require.extensions is not supported by webpack. Use a loader instead.

WARNING in ./~/handlebars/lib/index.js
require.extensions is not supported by webpack. Use a loader instead.

WARNING in ./~/handlebars/lib/index.js
require.extensions is not supported by webpack. Use a loader instead.

ERROR in ./~/handlebars/lib/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../dist/cjs/handlebars/compiler/printer in /home/abhisekp/MyProjects/JSApps/MadeWithLove-Webpack/node_modules/handlebars/lib
 @ ./~/handlebars/lib/index.js 9:14-64

ERROR in ./~/handlebars/lib/index.js
Module not found: Error: Cannot resolve module 'fs' in /home/abhisekp/MyProjects/JSApps/MadeWithLove-Webpack/node_modules/handlebars/lib
 @ ./~/handlebars/lib/index.js 17:11-24

ERROR in ./~/handlebars/lib/index.js
Module not found: Error: Cannot resolve 'file' or 'directory' ../dist/cjs/handlebars in /home/abhisekp/MyProjects/JSApps/MadeWithLove-Webpack/node_modules/handlebars/lib
 @ ./~/handlebars/lib/index.js 7:17-50 

私のindex.js

var handlebars = require('handlebars');

私のpackage.json

  "dependencies": {
    "handlebars": "^4.0.5"
  }

最も参考になるコメント

私はこれを..で回避しました。

resolve: {
    alias: {
       handlebars: 'handlebars/dist/handlebars.min.js'
    }
}

私のwebpack設定で

全てのコメント21件

#1102で述べたように、行を追加します
"browser": "dist/handlebars.js",
handlebarsのpackage.jsonにこれを解決してくれました。

ハンドルバーではなく、Webpackの問題のように聞こえます。
ノードモジュールコアファイルの通常のデフォルトパスは/ node_modules / module_name / distです。

これは、ノードアプリがそれらが配置されていると想定する場所です。 これは、Webpackがrequire()を処理していることを意味します。 ノードとは異なります。

私はこれを..で回避しました。

resolve: {
    alias: {
       handlebars: 'handlebars/dist/handlebars.min.js'
    }
}

私のwebpack設定で

ありがとう@gilesbradshaw :+1 :: smile:

@abhisekpこれは解決されましたか? はいの場合は閉じてください。

@rafde確認していませんが、問題が明確になり、明確な解決策が提案されたため、この問題を閉じます。

念押し有難う。 :赤面:

.jsのどこかにハンドルバーが必要な場合、まだ再現されている問題:

var Handlebars = require('handlebars');
Handlebars.registerHelper('greet', function(name) {
            return 'Hello, name=' + name + '!';
});

しかし、この行を削除すると

var Handlebars = require('handlebars');

問題はなくなりました

@gilesbradshaw
どうもありがとうございます!

Angular 2 CLIプロジェクトでハンドルバーを使用すると、このエラーも発生します。 AngularCLIチームがAngularCLIユーザーからWebpackの詳細を非表示にすることを決定し、Webpack構成の変更を公式にサポートしていないため、Webpack構成を変更できません。

@oocx次のようにnode_modulesフォルダーからJSファイルをインポートできます。

import 'handlebars/dist/handlebars.min.js';

これは問題なく動作します!

これをAngular4プロジェクトで機能させるには、次のことを行う必要がありました。
import * as handleBars from'handlebars / dist / handlebars ';

通常、私はこれを行うだけです:
import * as handleBars from'handlebars ';

上記の行は、ノードのtypescriptプロジェクトでは正常に機能しますが、Angular4では機能しません。

HandleBarsは、このようにインポートする必要がある唯一のプロジェクトです。 将来的に問題が発生するのではないかと心配になります。 HandleBarsはangularのwebpackではうまく機能しないようです。

誰かが問題を再現する最小限のサンプルプロジェクトを設定した場合、私は一見することができます。 しかし、「いつ」についての約束はありません...

@ swilliams-a3digital Could not find a declaration file for module宣言モジュール 'handlebars'を取得したり、@ types / handlebarsを追加したりしても役に立ちません。 これをどのように解決しましたか?

ここを探している他の人のために

これは私が見つけた最良の解決策です
https://github.com/valtech-nyc/brookjs/blob/master/packages/brookjs/webpack.config.js#L39 -L43
ここhttps://github.com/pcardune/handlebars-loader/issues/110#issuecomment-358681867

@mAAdhaTTahに感謝します

UPD:

//fix handlebars warnings
config.resolve.alias = {
    ...config.resolve.alias,
    'handlebars/runtime': 'handlebars/dist/cjs/handlebars.runtime',
    'handlebars': 'handlebars/dist/cjs/handlebars.runtime',
};

これは遅れます。
このhandlebarsライブラリは、このバグを修正しているはずです。
しかし、彼らは無視し、無視します。

回避策は次のものを置き換えることです。

import Handlebars from 'handlebars'

と:

import Handlebars from 'handlebars/dist/cjs/handlebars'

@catamphetamineこの問題に対する適切な解決策がある場合は、プルリクエストを提出してください。 何も壊れない限り、新しいバージョンをマージして公開します。 NodeJSのconst Handlebars = require('handlebars')ようなものや、古いバージョンのwebpackを使用した既存のセットアップは引き続き機能します。

「それでも彼らは無視し無視する」について:

ハンドルバーの問題点は、コラボレーターが少ないことです。現時点では、私が見る限り、アクティブなのは私だけです。 まあ、多かれ少なかれアクティブです。 今は23時26分です。私には日中の仕事やその他の趣味が家族にあるので、私はいつもプライベートプロジェクトに取り組むようになります。

ですから、「それでも彼らは無視して無視する」と書くとき、「彼ら」はそれほど多くありません。 このプロジェクトに取り組むために報酬を得ている「彼ら」はほぼ間違いなくありません。 人と話すのが楽しいし、問題を解決したり、バグを修正したり、テストを書いたりするのも楽しいので、私は人を助けます。 私はいくつかのプロジェクトでハンドルバーを自分で使用しているので、そして時々ステージライトに立つのは気持ちがいいからです。 しかし、そうすることが私の義務だとは思いません。 ですから、私は好きな問題を選びます。ほとんどの場合、迅速で明確な問題です。

したがって、ハンドルバーを使用していて、問題があり、誰もそれを解決しようとしない場合は、自分で解決策を提供するようにしてください。

まだ解決されていないようですので、問題を再開します。

時々ステージライトに立つのは気持ちがいいからです。

このライブラリほど人気はありませんが、私も楽しみのためにオープンソースをやっています。
また、私の履歴書の1行か2行についても。 より良い仕事を得るのに役立ちます。
@ nknapp / handlebars.jsのように、技術的にはプロジェクトではないため、単に楽しいだけでなく、あまり利益を得ていないことがわかります。
あなたはそれを維持し、 @ wycatsはURLバーが行く限りすべてのクレジットとgithubスターを取得します。
少なくとも今では、このプロジェクトはそれほど積極的に維持されていないことがわかりました。
それでも、それは多くの場所(レガシーを含む)で使用されていると思います。
たとえば、SendGridは最近、このhandlebars言語を使用して「カスタマイズ可能なテンプレート」をリリースしました。
https://sendgrid.com/blog/how-to-use-sendgrids-dynamic-templates-for-your-transactional-emails/
https://github.com/sendgrid/sendgrid-nodejs/issues/221

考えられる解決策としては、Babelがbabelbabel/register行ったように、パッケージをhandlebarshandlebars/registerに分割します。
import 'babel/register'実行する場合にのみ、 require()フックをインストールします。
それは別のメジャーバージョンにとっては重大な変更になるでしょうが、そのようなバージョンはおそらくないでしょう。
また、ルートにcore.jsmodule.exports = require('handlebars/dist/cjs/handlebars') )のようなファイルを作成すると、Webpackユーザーはhandlebars/core代わりにhandlebars/dist/cjs/handlebars handlebars/coreを必要とします(行とともにREADMEで)。
Webpackの作成者もドイツ出身です。

とにかく、 import Handlebars from 'handlebars/dist/cjs/handlebars'機能し、ライブラリ内の何も変更する必要はないと思います。おそらく、Webpackの場合は通常のインポートの代わりにimport Handlebars from 'handlebars/dist/cjs/handlebars'使用するドキュメントをREADMEに追加するだけです。

ちなみに、この号で以前に否定的なコメントを残していなかったので、私はあなたに特に言及していませんでした。
私は@methodboxと彼のコメントを参照してい

ハンドルバーではなく、Webpackの問題のように聞こえます。

そして@rafdeと彼のコメント:

他の誰もこの問題を抱えていないので、セットアップに問題があるようです

あなたのコメントは、Webpackが「間違っている」などとは主張していなかったので、あなたの側から間違った言葉はありませんでした。

誰かが問題を再現する最小限のサンプルプロジェクトを設定した場合、私は一見することができます。 しかし、「いつ」についての約束はありません...

「Webpackが間違っているので、問題を閉じてください」とは言わなかったので、コメントは大丈夫です。

@nknapp
とにかく、 import Handlebars from 'handlebars/dist/cjs/handlebars'は問題なく動作し、ライブラリ内の何も変更する必要はないと思います。
READMEに、「Webpackを使用している場合は、 import Handlebars from 'handlebars'ではなくimport Handlebars from 'handlebars/dist/cjs/handlebars' 」という行を追加するだけです。
import Handlebars from 'handlebars/dist/cjs/handlebars'は問題なく、機能します。

import Handlebars from 'handlebars/dist/cjs/handlebars

このコメントの時点で私のために働いた。

私は@catamphetamineに同意します。

より良いドキュメントは多くの価値があり、インストールページにその行を追加する人を殺すことはありません。

私たちは皆、素晴らしいものを作り、人々にそれらを使ってもらいたいと思っています。

しかし、ドキュメントがうまくいかない場合はどうなるかを推測してください...あなた以外の誰もがそれを理解することができないので、プロジェクトもそうです。

そして覚えておいてください...人々は彼らが理解していないことを恐れています。

-暴言を終わらせる-

しかし、私はあなたの図書館への努力に感謝します。
オープンソースの開発者であることは、多くの場合、ほとんど報われない、ありがたくて苦痛なオデッセイです。

実際、私は人々にハンドルバーを使わせようとはしていません。 私は人々がすでにそれを使うことに決めているのを助けようとしているだけです。

私は現在、新しいドキュメントサイトを構築しており(時間があればいつでも)、そこに含めます。

#1102で解決する必要があります

このページは役に立ちましたか?
0 / 5 - 0 評価