版本 WebStorm: 2017.2.4 Node: v6.11.4 Step1：在WebStorm 中配置启动项 点击 Edit Configurations -> 左上角创建“+” -> 选择 Node.js -> 填写名称 -> 配置参数 
文章图片
文章图片
参数说明： * Node interpreter: 1、这个参数是说使用什么启动程序，默认的是 `node`, 这里我们将它设置为`babel-node`, 可以是项目中`局部`的 babel 也可以是`全局`的babel-node,可以使用 `which babel-node` 查看 babel-node 全局路径。 2、node 和 babel-node 启动的区别：后者可以直接启动ES6语法的项目； 3、注意如果是 `windows` 出现`CreateProcess failed with error 193 (no message available)` 应该将其设置为 `./node_modules/bin/babel-node.cmd`,注意`npm >= 3`版本。 * Node parameters: --expose_debug_as=v8debug -- //不要忽略后面的两个 -- 1、这个是对于node 的启动参数. 如果报错“
bad option: - expose_debug_as=v8debug”，可以清空这个参数； 如果出现 `v8debug is not defined` 请不要忽略 `--expose_debug_as=v8debug`。 如果出现 `code.trim is not a function` 请不要忽略后面的 `--` * Working directory: 项目的路径 * JavaScript file: 入口文件 * Application parameters: 这个是项目中的参数, 使用`process.argv`获取。 * Environment variables: 环境变量相关, 比如: `NODE_ENV=development`。 注意这个是`key`, `value`的设置方式, 一一对应。
参考：
https://segmentfault.com/a/1190000008426318
Step2:代码映射（gulp 打包工具及gulp插件: gulp-sourcemaps） let
gulp
= require
(
'gulp'
)
;
// 打包工具 let
watch
= require
(
'gulp-watch'
)
;
// 监听源代码 let
babel
= require
(
'gulp-babel'
)
;
// 编译 let
sourcemaps
= require
(
'gulp-sourcemaps'
)
;
// 源代码与编译代码映射
gulp
.
task
(
'transform'
,
()
=> { // 待执行任务 return
gulp
.
src
(
'server/**/*.js'
) // 源代码目录 .
pipe
(
sourcemaps
.init
()) // 初始化
sourcemaps .
pipe
(
babel
()) // 编译 .
pipe
(
sourcemaps
.write
(
'.'
)) // 写映射文件 .
pipe
(
gulp
.
dest
(
'dist/server'
))
;
// 输出 }
)
;
gulp
.
task
(
'default'
,
()
=> { return
gulp
.start
(
'transform'
)
;
// 默认任务 }
)
;
gulp 参考：
https://www.gulpjs.com.cn/docs/api/ gulp-sourcemaps 参考：
https://www.npmjs.com/package/gulp-sourcemaps 什么是sourcemaps？ 阮一峰的网络日志 参考:
http://www.ruanyifeng.com/blog/2013/01/javascript_source_map.html
推荐阅读
- 携程实习篇|Node.js之process进程
- node中package.json和package-lock.json文件的作用
- sequlize统一格式化时间
- egg 如何接收xml数据
- node npm 设置全局仓库路径
- node require 导入模块解析 加载规则和加载机制
- node|node.js学习笔记-模块module
- window node配置安装的全局模块所在的路径cache的路径
- node|node.js express性能优化