require（'babel / register'）不起作用

Question

我在客戶端用Babel編譯器在ES6中編寫了同構應用程序。 我希望我的快速服務器具有與客戶端代碼相同的ES6語法。

不幸的是require('babel/register')不起作用..

server.js

require('babel/register'); // doesn't work
// require('babel-core/register); doesn't work..

const env = process.env.NODE_ENV || 'development';
const port = process.env.NODE_PORT || 1995;

const http = require('http');
const express = require('express');
const address = require('network-address');

let app = express();

app.set('port', port);
app.use(express.static(path.join(__dirname, 'public')));

app.get('*', (req, res) => {
   res.send('Hello!');
});

http.createServer(app).listen(app.get('port'), function () {
   console.info('Demo app is listening on "%s:%s" env="%s"', address(), app.get('port'), env);
});

Answer 1

由於Babel 6使用babel-register hook進行即時翻譯。

第一：

 npm install babel-register

然后要求：

require('babel-register');    
// not using 
// require('babel/register');
// or 
// require('babel-core/register);

要將您的Ecmascript 6代碼轉換為ecmascript 5 ，您必須使用require babel-register設置Babel presets ecmascript 5選項。如下所示：

require('babel-register')({
  presets: [ 'es2015' ]
});

與@ alexander-pustovalov的答案不同，你不需要.babelrc文件。

你還必須安裝babel-preset-es2015 ：

npm install babel-preset-es2015

最后你的Server.js文件將是：

require('babel-register')({
   presets: [ 'es2015' ]
});

const env = process.env.NODE_ENV || 'development';
const port = process.env.NODE_PORT || 1995;

const http = require('http');
const express = require('express');
const address = require('network-address');

let app = express();

app.set('port', port);
app.use(express.static(path.join(__dirname, 'public')));

app.get('*', (req, res) => {
   res.send('Hello!');
});

http.createServer(app).listen(app.get('port'), function () {
   console.info('Demo app is listening on "%s:%s" env="%s"', address(), app.get('port'), env);
});

Answer 2

require('babel/register')不會傳輸從中調用的文件。 如果您希望server.js包含在即時轉換中，您應該使用babel-node （Babel的CLI替換 node ）來執行它。

見我的答案在這里的一個例子。

Answer 3

我遇到了類似的問題，嘗試在服務器上呈現反應頁面（.jsx）。 我通過將下面的代碼段放在我的服務器文件的頂部來修復它

require('babel-register')({
    presets: ['es2015', 'react']
});

確保你安裝了npm babel-preset-es2015和babel-preset-react

Answer 4

根據這份文件你必須使用：

require("babel-register");

此外，您必須將.babelrc文件放在啟動服務器的目錄的根目錄中。

{
  "presets": ["es2015"]   
}

Answer 5

在2019年的前夕，我們在JS相關的庫中仍然沒有很好的文檔，但另一方面，我們有StackOverflow。

為了在Node.js上使用babel ，你需要

1. npm install @babel/register @babel/core @babel/preset-env
2. 使用附加內容創建pre-index.js文件
3. 運行node pre-index

您只能在index.js import s和其他功能，以及import或require s的文件。

require('@babel/register')({
    presets: [
        [
            "@babel/preset-env",
            {
                targets: {
                    node: "current"
                }
            }
        ]
    ]
});
require('./index.js');

Answer 6

解決這個問題的步驟：

1. 刪除require('babel/register'); 來自server.js
2. 創建另一個名為start.js的條目文件

3. 在start.js中，

   require('babel/register'); module.exports = require('./server.js');

結果是server.js中的所有代碼都將由寄存器動態轉換。 請確保您使用具有如下內容的.babelrc正確配置了babel

{
  "presets": ["es2015", "stage-0"]
}

Answer 7

自Babel 7使用以來，您可以使用@ babel / register

npm install --save-dev @babel/core @babel/register

要么

yarn add --dev @babel/core @babel/register

如果你正在使用紗線 。

在代碼中，您只需包含以下行：

require("@babel/register");

Answer 8

您需要使用 Babel編譯代碼。 查看他們網站上的文檔 。

安裝babel與npm install -g babel然后做babel app.js > compiledApp.js編譯您ES6代碼到ES5代碼。 然后，您可以運行compiledApp.js 。

如果你想使用像Object.assign這樣的ES6的一些函數，它們仍然需要運行時babel/register ，這些函數沒有編譯但是由於polyfill而執行。 （點擊這里查看示例和更多細節）

編輯：如評論中所述，您可以使用register進行動態編譯。 但是它會在register后編譯您需要的模塊。 它將從node掛鈎require函數。 更多這里 。 您仍然需要編譯register的文件或不在此文件中使用任何ES6。