タグ付けされた質問 「babeljs」

Babel(以前の6to5)はJavaScriptコンパイラです。ES6 + / ES2015コードをES5コードに変換します。

5
モジュール 'babel-core'が見つかりませんのエラー。react.js、webpack、およびExpressサーバーを使用する
webpackターミナルで実行すると、次のようになります。 Hash: efea76b1048c3a97b963 Version: webpack 1.12.13 Time: 33ms + 1 hidden modules ERROR in Cannot find module 'babel-core' これが私のwebpack.config.jsファイルです module.exports = { entry: './app-client.js', output: { filename: 'public/bundle.js' }, module: { loaders: [ { exclude: /(node_modules|app-server.js)/, loader: 'babel' } ] } } package.json { "name": "react", "version": "1.0.0", "description": "React …

12
エラー:ディレクトリ「/ Users / username」に対してプリセット「es2015」が見つかりませんでした
gulp-babelを使おうとすると、次のエラーが発生します。 エラー:ディレクトリ「/ Users / username」に対してプリセット「es2015」が見つかりませんでした es2015プリセットをグローバルおよびローカルにインストールしているので、これが問題になる理由がわかりません。 以下は私のgulpのセットアップとpackage.jsonです。 var babel = require('gulp-babel'); var es2015 = require('babel-preset-es2015'); gulp.task('babel', function() { return gulp.src('./app/main.js') .pipe(babel({ presets: [es2015] })) .pipe(gulp.dest('dist')); }); Package.json "devDependencies": { "babel-preset-es2015": "^6.3.13", "babel-preset-es2015-node5": "^1.1.1", "browser-sync": "^2.11.0", "gulp": "^3.9.0", "gulp-babel": "^6.1.1", "gulp-stylus": "^2.2.0" } ノードv5.1.0とbabelv6.4.0を使用しています これがターミナル出力です 端子出力

2
Webpack / Babel / Reactビルドエラー:「不明なオプション:foo / node_modules / react /react.js.Children」
webpackを使用してプロジェクトをビルドし、次のwebpack構成に反応しようとしています。 var path = require('path'); var webpack = require('webpack'); module.exports = { entry: [ 'babel-polyfill', './app/less/main.less', './app/main.js', 'webpack-dev-server/client?http://localhost:8080' ], output: { publicPath: '/', filename: 'dist/main.js' }, debug: true, devtool: 'source-map', module: { loaders: [ { test: /\.js$/, include: path.join(__dirname, 'app'), loader: 'babel-loader', query: { presets: ['react', 'es2015'] } }, { …

6
SyntaxError:モジュールの外部ではimportステートメントを使用できません
問題を引き起こしているApolloServerプロジェクトを持っているので、最新のBabelを使用すると、プロジェクトを更新して問題が発生する可能性があると思いました。私の「index.js」は: require('dotenv').config() import {startServer} from './server' startServer() そして、それを実行すると、「SyntaxError:モジュールの外でimportステートメントを使用できません」というエラーが表示されます。最初に、TPTB *にこれがモジュールであると納得させるために何かを試みました(成功しませんでした)。そこで、「インポート」を「必須」に変更し、これが機能しました。 しかし、今では他のファイルに約24の「インポート」があり、同じエラーが発生しています。 *問題の根本原因は、問題の不満がどこにあるかさえわからないことだと確信しています。私はそれがBabel 7であると想定していました(私はBabel 6から来ており、プリセットを変更する必要があったためです)が、100%確実ではありません。 私が見つけたソリューションのほとんどは、まっすぐなノードには当てはまらないようです。このようにここに: ES6モジュールのインポートで「Uncaught SyntaxError:Unexpected identifier」が表示される 「type = module」を追加することで解決されたと言いますが、これは通常、HTMLで行われますが、私にはありません。また、プロジェクトの古いプリセットを使用してみました。 "presets": ["es2015", "stage-2"], "plugins": [] しかし、それによって別のエラーが発生します。「エラー:プラグイン/プリセットファイルは、オブジェクトのみをエクスポートできません。関数のみです。」 更新:ここに私が始めた依存関係があります: "dependencies": { "@babel/polyfill": "^7.6.0", "apollo-link-error": "^1.1.12", "apollo-link-http": "^1.5.16", "apollo-server": "^2.9.6", "babel-preset-es2015": "^6.24.1",

2
1つのNPMパッケージから複数のES6モジュールをエクスポートする方法
私は、1つのファイルに含まれる約5つの異なるES6クラスで構成される比較的小さなNPMパッケージを作成しました。それらはすべて次のように見えます。 export default class MyClass { // ... } 次に、パッケージのエントリポイントを次のように設定しました。 export { default as MyClass } from './my-class.js'; export { default as MyOtherClass } from './my-other-class.js'; 次に、エントリポイントをwebpackとbabelを介して実行し、最終的には変換されて縮小されたindex.jsを生成します。 パッケージのインストールとインポートは正常に機能しますが、クライアントコードから以下を実行すると、 import { MyClass } from 'my-package'; "MyClass"をインポートするだけでなく、すべてのクラスのすべての依存関係を含むファイル全体をインポートします(私のクラスの一部には大きな依存関係があります)。 すでにバンドルされているパッケージの一部をインポートしようとすると、webpackがどのように機能するかわかりましたか?したがって、私はnode_modules/my-packagebabelも実行するようにローカルのWebpack構成をセットアップしてから、次のことを試しました。 import { MyClass } from 'my-package/src/index.js'; ただし、これでもindex.jsによってエクスポートされたすべてのクラスがインポートされます。私が望むように機能しているように見える唯一のことは、私がそうするならば: import MyClass from 'my-package/src/my-class.js'; しかし、私はむしろむしろ: 変換され縮小されたファイルをインポートできるため、node_modules内でbabelを実行するようにwebpackに指示する必要がありません。 各ファイルへのパスを入力する代わりに、エントリポイントから個々のクラスを直接インポートできる …

5
jestの「モジュールの外部でimportステートメントを使用できない」を解決する方法
TypeScript、Jest、Webpack、Babelを使用して構築されたReactアプリケーション(Create React Appを使用していない)があります。「yarn jest」を実行しようとすると、次のエラーが発生します。 すべてのパッケージを削除して再度追加してみました。これは解決されません。私は同様の質問とドキュメントを見ましたが、それでも何かを誤解しています。私はこの環境をゼロからセットアップするための別のガイドに従うまで行っても、私のコードでこの問題を受け取りました。 依存関係は... "dependencies": { "@babel/plugin-transform-runtime": "^7.6.2", "@babel/polyfill": "^7.6.0", "babel-jest": "^24.9.0", "react": "^16.8.6", "react-dom": "^16.8.6", "react-test-renderer": "^16.11.0", "source-map-loader": "^0.2.4" }, "devDependencies": { "@babel/core": "^7.6.0", "@babel/preset-env": "^7.6.0", "@babel/preset-react": "^7.0.0", "@types/enzyme": "^3.9.2", "@types/enzyme-adapter-react-16": "^1.0.5", "@types/jest": "^24.0.13", コンポーネントのインポート行... import * as React from "react"; import { BrowserRouter as Router, Route, …

1
Rails 6でJasmineを設定する方法は?
アプリ用に作成したJavascriptモジュールをテストできるように、Rails 6環境(WebpackがJavaScriptのアセットパイプラインを置き換える)でJasmineを構成するにはどうすればよいですか? 私はジャスミンのgemをインストールして実行しrails generate jasmine:install、jasmine.ymlJavaScriptソースと仕様の場所を指すように編集しました。 問題は、インポート/エクスポートステートメントを使用できないことです。(例えば、クロムでこのエラーのテスト結果に自分の最初のモジュールをロードしようとします。Uncaught SyntaxError: Unexpected token 'export') 私が言えることから、私はジャベルをセットアップしてbabelを使用する必要があります。しかし、私は新しいRails 6レイアウトでこれを行う方法についての説明を見つけることができません。

1
アプリケーションでtransform-runtimeとpreset-envを組み合わせる必要がありますか?
質問1 私は、彼らはすべてのヘルパー(等で、具体的には、(WebPACKの)バンドル(出力)結果には多くの不必要な重複があることがわかりclassCheck、objectSpread)によるオブジェクト広がりプラグインへ(。 だから、重複を減らしたい。ライブラリの場合、確かに、transform-runtimeプラグイン(を参照runtime-corejs3)を使用してこれを行います。しかし、これはアプリケーションなので、これを行う正しい方法は何ですか? そのため、transfrom-runtimeプラグインがライブラリに推奨されているため(そして全体の削減のために、つまりヘルパーなど)core-js、混乱していますregenerator。しかし、ここでは、ヘルパーの重複を減らしたいだけです。他の重複ではなく、それがによって行われているためです。babel/env だからここで私が聞きたい/議論したい質問は、もしそうならhelpers、アプリケーションの重複を減らす必要があるということです、そしてどのように? 質問2 他の質問があり、core-js/modules/es.promise.jsかつ core-js-pure/modules/es.promise.js、正確に同じコードしている、主な違いは、単に前者はグローバルな環境汚染を持っているということでしょうか?もしそうなら、なぜポリフィルにcore-js使用(直接インポート)core-js-pureしてからグローバルに追加しないのですか?IMO、これは重複を大幅に削減します。現在ライブラリはtransform-runtime(最終的にcore-js-pure)使用しますが、アプリはpreset-env(最終的にcore-js)使用するため、アプリとライブラリの間で共有/共有可能なコードはありませんよね?
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.