如何管理节点。启用ES6功能的js应用程序?

时间:2022-02-19 15:25:17

I use the require hook of BabelJS (formerly named 6to5) to run node apps with es6features:

我使用BabelJS(原名6to5)的require hook来运行带有es6features的节点应用:

// run.js
require("babel/register");
require("./app.js6");

I call node run.js to run my app.js6. I need to install BabelJS and provide a run.js for each project I'd like to use es6features. I would prefer a call like nodejs6 app.js6. How can I achieve this system independently (Unix and Windows)?

我叫节点运行。js运行我的app.js6。我需要安装BabelJS并提供运行。对于每个项目,我想使用es6特性。我希望调用nodejs6 app.js6。如何独立地实现这个系统(Unix和Windows)?

7 个解决方案

#1


99  

Add the babel-cli and babel-preset-es2015 (aka ES6) dependencies to your app's package.json file and define a start script:

添加babel-cli和babel-preset-es2015(也就是ES6)依赖于您的应用程序包。json文件并定义一个start脚本:

{
  "dependencies": {
    "babel-cli": "^6.0.0",
    "babel-preset-es2015": "^6.0.0"
  },
  "scripts": {
    "start": "babel-node --presets es2015 app.js"
  }
}

Then you can simply execute the following command to run your app:

然后您可以执行以下命令来运行您的应用程序:

npm start

If you ever decide to stop using Babel (e.g. once Node.js supports all ES6 features), you can just remove it from package.json:

如果您决定停止使用Babel(例如,once Node)。js支持所有ES6特性),你可以从package中移除它。

{
  "dependencies": {},
  "scripts": {
    "start": "node app.js"
  }
}

One benefit of this is that the command to run your app remains the same, which helps if you are working with other developers.

这样做的一个好处是,运行应用程序的命令保持不变,这有助于您与其他开发人员合作。

#2


26  

How configure node.js app with es6 support and server reload on file change.

如何配置节点。支持es6的js应用,文件修改后重新加载服务器。


I.Configuration steps ( creating project from the scratch ):

1.Go in terminal to Your project main directory

1。进入终端到项目主目录

npm init //create package.json for project

npm init / /创建包。json对于项目

2.Install dependencies

2。安装依赖关系

npm install --save-dev babel
npm install --save-dev babel-cli
npm install --save-dev babel-preset-es2015
npm install --save-dev babel-preset-stage-0 //*1
npm install --save-dev nodemon

1 - it can be also stage-1 or 2, it depends what features of es We want to use

1 -它也可以是stage-1或stage- 2,这取决于我们想要使用es的哪些特性

3.We should have in package.json file something like that ( for sure package version will be different but it is ok ):

3所示。我们应该有包装。json文件是这样的(当然包版本会有所不同,但是也可以):

"devDependencies": {
  "babel": "^6.5.2",
  "babel-cli": "^6.16.0",
  "babel-preset-es2015": "^6.16.0",
  "babel-preset-stage-0": "^6.16.0",
  "nodemon": "^1.11.0"
}

4.Create .babelrc file in root project directory ( there is package.json file )

4所示。在根项目目录中创建.babelrc文件(有包)。json文件)

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

5.Create two directories:

5。创建两个目录:

src - here is working directory with files writen in es6

这是在es6中写入文件的工作目录

dist - here files will compile to es5 using babel

这里的文件将使用babel编译到es5

Your project root directory should look like this:

您的项目根目录应该如下所示:

  • project
    • src
      • index.js //main project file
      • 索引。js / /主项目文件
    • src指数。js / /主项目文件
    • dist
    • 经销
    • package.json
    • package.json
    • .babelrc
    • .babelrc
  • 项目的src指数。/主项目文件区包。json .babelrc

7.Add to package.json needed commands:

7所示。添加到包中。json需要命令:

"scripts": {
  "watch": "babel -w src/ -d dist/",
  "build": "babel src/ -d dist/",
  "serve": "babel -w src/ -d dist/ | nodemon --watch dist",
  "test": "echo \"Error: no test specified\" && exit 1"
}

8.Available commands:

8。可用命令:

npm run watch //starts watch watch changes in src directory and compiles in to dist

运行监视// /开始监视src目录中的监视更改并将其编译为dist

npm run build //compiles files from src directory to dist

npm运行构建//编译从src目录到dist的文件。

npm run serve //it is doing watch + start node server, on every file change it will restart node server using nodemon which is watching dist directory changes

npm运行服务//它正在做监视+开始节点服务器,在每次文件更改时,它将使用nodemon重新启动节点服务器,它正在监视dist目录更改

9.Final notes

9。最后指出

  • Server will run dist/index.js file as main file.
  • 服务器将运行dist /索引。js文件为主文件。
  • File dist/index.js will be compiled from src/index.js so there should be main file of project.
  • dist /索引文件。js将由src/index编译。所以应该有项目的主文件。
  • dist directory should be added to ignore by git ( but not ignore it for npm if it will be a node package )
  • 应该将dist目录添加到git中以忽略它(但如果npm是节点包,则不要忽略它)

10.Run server and start creating app in src directory.

10。运行服务器并开始在src目录中创建应用程序。

npm run serve

II. Easier way ( ready to use boilerplate )

If it is too many points for You then full woking boilerplate is available on github - https://github.com/maciejsikora/node-express-babel-boilerplate.

如果对您来说有太多的点,那么可以在github上使用完整的woking boilerplate—https://github.com/maciejsikora/node-express-babel-boilerplate。

#3


14  

You can use node with --harmony flag to run script with es6 features

您可以使用带有——harmony标志的node来运行带有es6特性的脚本

#4


6  

you need to install babel-register and babel-preset-es2015 preset Which used into babel-register options to Enabled convert ES6 to ES5 on-the-fly transpilation

您需要安装用于babel-register选项的babel-register和babel-preset-es2015预置,以便能够即时将ES6转换为ES5

 npm install babel-register

 npm install babel-preset-es2015

your run.js file:

你的运行。js文件:

// require babel-register and set Babel presets options to es2015
require('babel-register')({
   presets: [ 'es2015' ]
});

require("./app.js6");

Notice: Now you does not need .babelrc file to set Babel presets options As we setting it with require method

注意:现在您不需要.babelrc文件来设置Babel预设选项,因为我们用require方法设置它。

#5


3  

I would prefer a call like nodejs6 app.js6.

我想要一个叫nodejs6 app.js6的电话。

You may try the wrapper solution with babel-core api:

您可以使用babel-core api尝试包装解决方案:

// Save as es6.js

var babel = require("babel-core");
var argc = process.argv.length;

babel.transformFile(process.argv[argc - 1], function (err, result) {
    eval(result.code);
});

Run your es6 featured script with node es6 thefile.js

使用节点es6 thefile.js运行es6特性脚本

Reference: offical usage doc

参考:官方使用doc

#6


1  

As of babel 6, you now must install babel-register and use the following

从babel 6开始,您现在必须安装babel-register并使用以下代码

require("babel-register");

Be sure to also install the babel es2015 preset.

一定要安装babel es2015预置。

#7


0  

  1. node -r babel-register scripts.js
  2. 节点- r babel-register scripts.js

This is the best solution

这是最好的解决方案。

  1. npx babel-node scripts.js
  2. npx babel-node scripts.js

!Babel node doesn't work well in case of exit process and kexec package also doesn't help in this case (as I tried)

!在退出过程中,Babel节点不能正常工作,kexec包在这种情况下也不起作用(正如我所尝试的)

In both cases you need to use .babelrc which should describe presets and plugins for your app.

在这两种情况下,都需要使用。babelrc来描述应用程序的预设和插件。

npx is using only for execution of libraries which are not installed with npm or yarn . Otherwise you need to npm i -g babel-cli and then babel-node script.js

npx仅用于未安装npm或纱线的库的执行。否则,您需要npm i -g babel-cli,然后是babel-node script.js

#1


99  

Add the babel-cli and babel-preset-es2015 (aka ES6) dependencies to your app's package.json file and define a start script:

添加babel-cli和babel-preset-es2015(也就是ES6)依赖于您的应用程序包。json文件并定义一个start脚本:

{
  "dependencies": {
    "babel-cli": "^6.0.0",
    "babel-preset-es2015": "^6.0.0"
  },
  "scripts": {
    "start": "babel-node --presets es2015 app.js"
  }
}

Then you can simply execute the following command to run your app:

然后您可以执行以下命令来运行您的应用程序:

npm start

If you ever decide to stop using Babel (e.g. once Node.js supports all ES6 features), you can just remove it from package.json:

如果您决定停止使用Babel(例如,once Node)。js支持所有ES6特性),你可以从package中移除它。

{
  "dependencies": {},
  "scripts": {
    "start": "node app.js"
  }
}

One benefit of this is that the command to run your app remains the same, which helps if you are working with other developers.

这样做的一个好处是,运行应用程序的命令保持不变,这有助于您与其他开发人员合作。

#2


26  

How configure node.js app with es6 support and server reload on file change.

如何配置节点。支持es6的js应用,文件修改后重新加载服务器。


I.Configuration steps ( creating project from the scratch ):

1.Go in terminal to Your project main directory

1。进入终端到项目主目录

npm init //create package.json for project

npm init / /创建包。json对于项目

2.Install dependencies

2。安装依赖关系

npm install --save-dev babel
npm install --save-dev babel-cli
npm install --save-dev babel-preset-es2015
npm install --save-dev babel-preset-stage-0 //*1
npm install --save-dev nodemon

1 - it can be also stage-1 or 2, it depends what features of es We want to use

1 -它也可以是stage-1或stage- 2,这取决于我们想要使用es的哪些特性

3.We should have in package.json file something like that ( for sure package version will be different but it is ok ):

3所示。我们应该有包装。json文件是这样的(当然包版本会有所不同,但是也可以):

"devDependencies": {
  "babel": "^6.5.2",
  "babel-cli": "^6.16.0",
  "babel-preset-es2015": "^6.16.0",
  "babel-preset-stage-0": "^6.16.0",
  "nodemon": "^1.11.0"
}

4.Create .babelrc file in root project directory ( there is package.json file )

4所示。在根项目目录中创建.babelrc文件(有包)。json文件)

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

5.Create two directories:

5。创建两个目录:

src - here is working directory with files writen in es6

这是在es6中写入文件的工作目录

dist - here files will compile to es5 using babel

这里的文件将使用babel编译到es5

Your project root directory should look like this:

您的项目根目录应该如下所示:

  • project
    • src
      • index.js //main project file
      • 索引。js / /主项目文件
    • src指数。js / /主项目文件
    • dist
    • 经销
    • package.json
    • package.json
    • .babelrc
    • .babelrc
  • 项目的src指数。/主项目文件区包。json .babelrc

7.Add to package.json needed commands:

7所示。添加到包中。json需要命令:

"scripts": {
  "watch": "babel -w src/ -d dist/",
  "build": "babel src/ -d dist/",
  "serve": "babel -w src/ -d dist/ | nodemon --watch dist",
  "test": "echo \"Error: no test specified\" && exit 1"
}

8.Available commands:

8。可用命令:

npm run watch //starts watch watch changes in src directory and compiles in to dist

运行监视// /开始监视src目录中的监视更改并将其编译为dist

npm run build //compiles files from src directory to dist

npm运行构建//编译从src目录到dist的文件。

npm run serve //it is doing watch + start node server, on every file change it will restart node server using nodemon which is watching dist directory changes

npm运行服务//它正在做监视+开始节点服务器,在每次文件更改时,它将使用nodemon重新启动节点服务器,它正在监视dist目录更改

9.Final notes

9。最后指出

  • Server will run dist/index.js file as main file.
  • 服务器将运行dist /索引。js文件为主文件。
  • File dist/index.js will be compiled from src/index.js so there should be main file of project.
  • dist /索引文件。js将由src/index编译。所以应该有项目的主文件。
  • dist directory should be added to ignore by git ( but not ignore it for npm if it will be a node package )
  • 应该将dist目录添加到git中以忽略它(但如果npm是节点包,则不要忽略它)

10.Run server and start creating app in src directory.

10。运行服务器并开始在src目录中创建应用程序。

npm run serve

II. Easier way ( ready to use boilerplate )

If it is too many points for You then full woking boilerplate is available on github - https://github.com/maciejsikora/node-express-babel-boilerplate.

如果对您来说有太多的点,那么可以在github上使用完整的woking boilerplate—https://github.com/maciejsikora/node-express-babel-boilerplate。

#3


14  

You can use node with --harmony flag to run script with es6 features

您可以使用带有——harmony标志的node来运行带有es6特性的脚本

#4


6  

you need to install babel-register and babel-preset-es2015 preset Which used into babel-register options to Enabled convert ES6 to ES5 on-the-fly transpilation

您需要安装用于babel-register选项的babel-register和babel-preset-es2015预置,以便能够即时将ES6转换为ES5

 npm install babel-register

 npm install babel-preset-es2015

your run.js file:

你的运行。js文件:

// require babel-register and set Babel presets options to es2015
require('babel-register')({
   presets: [ 'es2015' ]
});

require("./app.js6");

Notice: Now you does not need .babelrc file to set Babel presets options As we setting it with require method

注意:现在您不需要.babelrc文件来设置Babel预设选项,因为我们用require方法设置它。

#5


3  

I would prefer a call like nodejs6 app.js6.

我想要一个叫nodejs6 app.js6的电话。

You may try the wrapper solution with babel-core api:

您可以使用babel-core api尝试包装解决方案:

// Save as es6.js

var babel = require("babel-core");
var argc = process.argv.length;

babel.transformFile(process.argv[argc - 1], function (err, result) {
    eval(result.code);
});

Run your es6 featured script with node es6 thefile.js

使用节点es6 thefile.js运行es6特性脚本

Reference: offical usage doc

参考:官方使用doc

#6


1  

As of babel 6, you now must install babel-register and use the following

从babel 6开始,您现在必须安装babel-register并使用以下代码

require("babel-register");

Be sure to also install the babel es2015 preset.

一定要安装babel es2015预置。

#7


0  

  1. node -r babel-register scripts.js
  2. 节点- r babel-register scripts.js

This is the best solution

这是最好的解决方案。

  1. npx babel-node scripts.js
  2. npx babel-node scripts.js

!Babel node doesn't work well in case of exit process and kexec package also doesn't help in this case (as I tried)

!在退出过程中,Babel节点不能正常工作,kexec包在这种情况下也不起作用(正如我所尝试的)

In both cases you need to use .babelrc which should describe presets and plugins for your app.

在这两种情况下,都需要使用。babelrc来描述应用程序的预设和插件。

npx is using only for execution of libraries which are not installed with npm or yarn . Otherwise you need to npm i -g babel-cli and then babel-node script.js

npx仅用于未安装npm或纱线的库的执行。否则,您需要npm i -g babel-cli,然后是babel-node script.js