NPMモジュールがインポートされるエラーがスローされます

Question

Iが反応/ WebPACKのアプリケーション上で動作するように、次のモジュールを取得しようとしている：私はモジュールをインポートするたびに

https://github.com/ripjar/material-datetime-picker

私のサーバーは、文句を言わない起動し、それがクラッシュします構文エラー：Uncaught SyntaxError: Unexpected token importとなります。

モジュール全体では、インポート/エクスポートにes6が使用されているようですが、モジュールをインストールして自分のファイルにエクスポートしようとすると、これらの行がモジュールを壊してしまいます。

私はモジュールのソースコードとスタンドアロン版を調べてみましたが、いずれも動作しませんでした - しかし、モジュールはスタンドアロンのHTMLファイル内で動作します。ローカルに。

これはwebpackとの非互換性に関係しますか？私はシニア開発者と一緒にコードを使って作業しており、モジュールをロードすることはまったくないようです。

Answer 1

Babel

ようES6コンパイラを使用していないながら、どうやらあなたはES6モジュールをインポートしようとしているあなたはrequireを使用して、それを追加することを検討すべきであるCommonJSでそれを使用する場合：

var MaterialDateTimePicker = require('material-datetime-picker'); 

Answer 2

私はあなたを信じてフロントエンド（ブラウザ）にこのモジュール/ jsを使用しています。ビルド環境でbabelifyを使用することをお勧めします。特定のリンクでドキュメントを確認できます。あなたはバベルが正しく設定されていないよう

webpack-for-browserify-users

babeljs.io-installation

babel/babelify

バベルが

var fs = require("fs"); var browserify = require("browserify"); 
var babelify = require("babelify"); 

browserify({ debug: true }) 
    .transform(babelify) 
    .require("./script.js", { entry: true }) 
    .bundle() 
    .on("error", function (err) { 
     console.log("Error: " + err.message); 
    }).pipe(fs.createWriteStream("bundle.js"));