现代WebGIS开发教程之ES6基础2开发环境

开端
  Node.js 环境配置好以后，可以在命令行通过交互式方法编写代码，没有语法检查，没有提示，效率比较低，因此需要一个趁手的 IDE，我不打算在这里讨论什么 IDE 好，高手用 vim，全靠命令也比你快。我这里介绍的是 WebStorm/IntelliJ 的基本配置。
基本操作
  WebStorm/IntelliJ 官网免费下载试用。地址：https://www.jetbrains.com/web… https://www.jetbrains.com/idea 下载安装后，就可以用了打开后应该长这样，中介略去初始插件配置，美化配置，授权环节若干步骤 …

  接下来就可以新建项目了，做开发英语是基本的素质，不要问我有没有汉化版，菜单在哪里。这货支持的项目类型挺多

  我偏喜欢从头开始，项目走起
  然后自己在项目下面新建一个目录，IDE 在下方可以激活Terminal 窗口，进入子目录，敲命令

cd path/to/dir

真正的新建项目
  IDE 新建项目时为了方便 IDE 的管理，而作为 Web 项目，真正的管理工具是 npm，在 terminal 中敲

npm init

  在一系列提示和输入之后就完成创建了，至于提问部分：项目名，版本，简述，入口文件，测试命令，git 库地址，关键词，作者，开源协议。好吧，做项目要本着开源精神。总之最后 yes 后面回车就 ok 了。再看看 IDE，打开生成 package.json，就是这样了，这里我删除了 test 命令。

  接下来在目录面新建 src 目录，创建 index.js，编写代码，可以看到有语法提示了

let result = console.log('Hello, World!');
console.log(result);

  配置运行

  然后运行

  输出的结果和上篇交互式环境中一样输出，我们可以理解为交互式环境默认都加了 console.log 输出语句结果，因此出现了 undefined。
  到目前为止只是运行，三分代码，七分调试，IDE 的调试功能很重要，把代码改成

const greeting = `Hello, World!`;
let result = console.log(`${greeting}`);
console.log(result);

  在 let result = console.log(${greeting}); 处设置断点，点击调试按钮，弹出调试面板，程序运行到此处就会停止，可以添加监视变量，逐过程，逐语句调试，各种调试功能就出现了。

  以上就是 WebStorm/IntelliJ 的基本操作，本篇 npm 创建了项目，但是运行调试还没有用上，为什么要 npm 配置项目呢，后面会介绍。