如何在服务器端代码中设置带节点JS的Babel 6以使用ES6 ?

I have read several times the documentation provided at : Node API Babel 6 Docs

我已经多次阅读了在:Node API Babel 6 Docs提供的文档

I'm starting out learning pg-promise following the Learn by Example tutorial and would prefer to work with ES6 and transpile to ES5 with Babel but am unsure of a few things :

我开始学习pg-promise后面的学习通过示例教程，我更愿意与ES6合作，并通过Babel传播到ES5，但我不确定一些事情:

1. After installing babel-core, what preset do I use and where/how do I configure this to work?
2. 在安装了babel-core之后，我应该使用什么预置，以及在哪里/如何配置它来工作?

The documentation was unclear to me about which file I put: require("babel-core").transform("code", options); into and what parts of that code are place holders. When I use that code, do I just use it one time somewhere and then I can use ES6 in every other file? How would this be achieved?

文档对我来说不清楚我放了哪个文件:require(“babel-core”)。变换(“代码”,选项);代码的哪些部分是位置占位符。当我使用这些代码时，我是否只在某个地方使用过一次，然后我就可以在其他文件中使用ES6了?这将如何实现?

2. I read about this .babelrc file and would like to confirm if the actual filename is ".babelrc" or if that is just the file extension and where in relation to the root directory of my project do I put that file.. and how do I link to it?

   我阅读了这个.babelrc文件，并想确认文件名是否为“”。如果那只是文件扩展名，并且在我的项目的根目录中，我应该把那个文件放在哪里。如何连接到它呢?

3. If I'm using pg-promise should I be using ES6 and Babel or will running : npm install as described under the Testing section for pg-promise be enough and trying to use ES6 with this create more problems?

   如果我正在使用pg-promise，我应该使用ES6和Babel还是将要运行:npm安装，如pg-promise的测试部分所述，是否足够，并尝试使用ES6来解决这个问题?

I was hoping to take advantage of let and const if the need came up during my server side development.

如果在服务器端开发过程中出现需要，我希望利用let和const。

4. Is there a standard file structure for a node+babel+pg-promise server setup?
5. 是否有一个节点+babel+pg-promise服务器设置的标准文件结构?

Edit Worth noting that I have also read Node JS with Babel-Node and saw that using this should be avoided. The final answer at the very bottom didn't really make sense to me for similar reasons I'm having trouble following the actual documentation provided by Babel.

值得注意的是，我还阅读了带有Babel-Node的Node JS，并看到应该避免使用它。最后的答案对我来说没有意义，因为类似的原因我在Babel提供的实际文档中遇到了麻烦。

3 个解决方案

#1

1.a What Preset is needed?

You will need to install Babel firstly with npm install babel-core --save-dev in the root directory of your project using a Terminal window like Command Prompt.

您将需要首先安装Babel和npm，使用命令提示符之类的终端窗口在项目的根目录中安装Babel -core -save-dev。

Once installed, you will need to install the es2015 preset with npm install babel-preset-es2015 --save-dev. Babel-Core is Promises/A+ Compliant but not ideal for usage due to poor error handling so a library such as Bluebird should be used instead for this purpose. In order to transpile, babel-core will still need to be installed and es2015 enables ES6->ES5 transpiling so you can use fancy things like let and const etc.

一旦安装，您将需要安装es2015预置与npm安装babel-preset-es2015——save-dev。Babel-Core是承诺/A+兼容的，但是由于错误处理不好，所以应该使用Bluebird之类的库来替代它。为了实现透明，还需要安装babel-core, es2015支持ES6->ES5的跨接，可以使用let和const等花哨的东西。

1.b Where to put require("babel-core");?

instead, use require("babel-core/register"); and place it inside your Entry file typically called, "server.js". The server.js file will need to use CommonJS (ES5) exclusively.

相反,使用要求(“babel-core /注册”);并将它放在通常称为“server.js”的条目文件中。服务器。js文件只需要使用CommonJS (ES5)。

By using the "require" statement it will apply all relevant transforms to all code being required into the Entry file and all files being required/included into those files.

通过使用“require”语句，它将把所有相关的转换应用到条目文件中需要的所有代码，以及这些文件中需要/包含的所有文件。

You point to the Entry file inside package.json under the "main": section.

指向包内的条目文件。“main”下面的json: section。

Package.json is created when you initialise the project with npm init at the root directory of your project inside the Terminal Window

包中。当您在终端窗口内的项目根目录中初始化npm init项目时，将创建json

One approach to this would be :

一种方法是:

• Entry File - server.js
• 输入文件- server.js
• server.js - requires {babel-core and the main ES6 file : config.js/jsx/es6/es}
• 服务器。js -需要{babel-core和主ES6文件:config.js/jsx/ ES6 /es}
• config.es6 - uses ES6 and has includes(requires) for all other project files that can also use ES6 as they get transpiled by being loaded into the "config" file which is being directly transpiled by babel-core.
• config. ES6——使用ES6，并包含(需要)所有其他项目文件，这些文件也可以在加载到babel-core直接传输的“config”文件时使用ES6。

2. What is .babelrc?

.babelrc is the filename and should be placed in the same folder as your package.json file (normally the root directory) and will automatically "load" when babel-core is required to determine which preset(s) or plugins are to be used.

.babelrc是文件名，应该放在与您的包相同的文件夹中。json文件(通常是根目录)，当需要babel-core来确定使用哪些预设置或插件时，将自动“加载”。

Inside .babelrc , you will need to add the following code :

在。babelrc中，您需要添加以下代码:

{
  "presets": ["es2015"]
}

3. pg-promise Testing Section

A direct quote from the developer recently answered this

最近开发人员的直接引用回答了这个问题

You do not need to worry about steps in the Tests, use only the steps in the install. The one in tests relates to the dev dependency installation, in order to run tests. The pg-promise can work with any promise library compliant with Promises/A+ spec.

您不需要担心测试中的步骤，只需使用安装中的步骤。测试中的那个与dev依赖安装相关，以便运行测试。pg-promise可以与任何遵守承诺/A+规范的承诺库一起工作。

4. Standard File/Folder Structure for Server Side Projects?

There is no standard way to achieve this task as each project has unique demands. A good starting point would be to place the Entry file in the project root directory, the ES6 Config file in a "scripts" or "src" sub-folder and individual components in folders below that.

由于每个项目都有独特的需求，所以没有标准的方法来完成这个任务。一个好的起点是将条目文件放在项目根目录中，将ES6配置文件放在“scripts”或“src”子文件夹中，并将各个组件放在下面的文件夹中。

e.g.

如。

• ROOT/server.js
• 根/ server.js
• ROOT/src/config.es6
• 根/ src / config.es6
• ROOT/src/component1/files.es6
• 根/ src / component1 / files.es6
• ROOT/src/component2/files.es6
• 根/ src /于component2 / files.es6

With this in place, Babel will successfully transpile all ES6 to ES5 and enable support of A+ compliant promises.

有了这一点，Babel将成功地传播所有ES6到ES5，并支持+兼容的承诺。

To begin using the node.js webserver This Guide provides a bit more insight and in the context of this answer the code shown would be placed into the ES6 config.es6 file and the following code would go into the Entry server.js file :

开始使用节点。本指南提供了更多的见解，在这个答案的上下文中，显示的代码将被放置到ES6 config.es6文件中，下面的代码将进入入口服务器。js文件:

require("babel-core/register");
require("./src/config.es6");

The process for building Isomorphic web applications is different to this and would likely use things like grunt, gulp, webpack, babel-loader etc another example of which can be Found Here.

构建同构web应用程序的过程与此不同，可能会使用grunt、gulp、webpack、babel-loader等其他示例。

This answer is the combination of several key points provided by other answers to this question as well as contributions from experienced developers and my own personal research and testing. Thank you to all who assisted in the production of this answer.

这个答案是对这个问题的其他回答所提供的几个关键点的组合，以及来自经验丰富的开发人员和我自己的研究和测试的贡献。感谢所有协助编写此答案的人。

#2

1. This answer uses this simple directory structure

   这个答案使用了这个简单的目录结构

   project/server/src/index.js => your server file

   项目/服务器/ src /索引。js =>您的服务器文件

   project/server/dist/ => where babel will put your transpiled file

   项目/服务器/dist/ =>， babel将放置您的传输文件

2. Install babel dependencies

   巴别塔安装依赖关系

   npm install -g babel nodemon

   npm安装-g babel nodemon。

   npm install --save-dev babel-core babel-preset-es2015

   npm安装——save-dev babel-core babel-preset-es2015

3. Add these npm scripts to your package.json file

   将这些npm脚本添加到包中。json文件

   "scripts": { "compile": "babel server/src --out-dir server/dist", "server": "nodemon server/dist/index.js }

   “脚本”:{“编译”:“babel server/src -out dir server/dist”，“server”:“nodemon server/dist/index”。js }

4. Create a .babelrc file in your project root directory

   在项目根目录中创建.babelrc文件

   { "presets": "es2015" }

   {“预设”:“es2015”}

5. Transpile your directory with

   Transpile你的目录

   npm run compile

   npm运行编译

6. Run your server with

   运行您的服务器

   npm run server

   npm运行服务器

#3

I think you should use a tool like grunt or gulp to manage all your "build" tasks. It will automate it for you, and you won't make errors.

我认为您应该使用咕哝或咕哝之类的工具来管理所有的“构建”任务。它会自动为你操作，你不会出错。

In one command, you can transpile your code into babel ES2015 et start your application.

在一个命令中，您可以将代码转入babel ES2015 et来启动应用程序。

I suggest you to take a look at this simple project. (just install node_modules and launch npm start to start the app.js file)

我建议你看看这个简单的项目。(只需安装node_modules并启动npm start来启动app.js文件)

However, if you really want to use babel manually,

但是，如果你真的想手动使用babel，

• .babelrc is the name of the file, you can see one in this project (redux) to have an example

  .babelrc是文件的名称，您可以在这个项目(redux)中看到一个例子

• .babelrc is a config file, if you want to see how it works, you can check this package.json (always redux)

  babelrc是一个配置文件，如果您想了解它是如何工作的，可以检查这个包。json(总是回来的)

• There's actually no standard way that I know. You can use the project skeleton below if needed, and send pull request to improve it :-)

  实际上我不知道有什么标准的方法。如果需要，您可以使用下面的项目框架，并发送拉取请求来改进:-)