`

Sublime Text 之运行 ES6 (基于babel)

 
阅读更多

直接进入正文吧。

安装Babel

 

1
$ npm install -g babel

 

好了,没什么好说的。

创建Sublime Text编译系统

选择菜单Tools –> Build System –> new Build System…

中文版的话是工具 –> 编译系统 –> 新建编译系统…

然后写如下配置:

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
{
    "working_dir": "${project_path:${folder}}",
    "selector": "source.js",
    "encoding": "utf-8",
    "shell": true,
    "windows": {
        "cmd": ["taskkill /f /im node.exe >nul 2>nul & babel-node $file"]
    },
    "osx": {
        "cmd": ["killall node >/dev/null 2>&1; babel-node $file"]
    },
    "linux": {
        "cmd": ["killall node >/dev/null 2>&1; babel-node $file"]
    }
}

 

接着保存为javascript.sublime-build,保存位置默认即可。

好了,现在你可以写 es6 的代码测试下了,下面是运行效果。

mac 效果

win 效果

运行失败处理

当然也有运行不了的情况,不过大体就分为下面2种。

一. 环境变量

如果执行不了,而是报错,错误类似xxx babel-node: command not found这样的,那么就是环境变量的问题。
只要添加下nodebabel-node的路径到环境变量里。

如果是mac下,我推荐添加path属性到你的javascript.sublime-build里,会更方便。

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
{
    "path": "/usr/local/bin",
    "working_dir": "${project_path:${folder}}",
    "selector": "source.js",
    "encoding": "utf-8",
    "shell": true,
    "windows": {
        "cmd": ["taskkill /f /im node.exe >nul 2>nul & babel-node $file"]
    },
    "osx": {
        "cmd": ["killall node >/dev/null 2>&1; babel-node $file"]
    },
    "linux": {
        "cmd": ["killall node >/dev/null 2>&1; babel-node $file"]
    }
}

 

就类似这样,mac 下就可以运行了。 win 下安装 node 默认就添加到环境变量了,所以不需要考虑这样的问题。

二. 含有中文路径 (仅win)

当路径里出现中文的时候,win 下什么都不会输出,好奇怪,我也不知道为什么,但 mac 下可以正常运行。
他们唯一区别只是环境字符集一个默认是 gbk,一个是 utf-8,难道只是这个问题?
如果有哪位大神知道,还望指点一二。

三. 中文用户名 (仅win)

如果你的系统用户名是中文的,我指的是系统登录的用户名,如果是中文的,那么怎么都运行不了,奇怪了。
一开始我以为是C:Users用户名AppDataRoamingnpm这个问题,但是我修改了 npm 安装目录,问题依旧。

暂时没想到好的处理方法,最直接有效的解决方法就是换英文用户名。 

分享到:
评论

相关推荐

    Sublime Text 4(Build 4126)修改运行配置为终端运行(C/C++、Java、Python)

    Sublime Text 4(Build 4126)修改运行配置为终端运行(内含C/C++、Java、Python四门语言的配置)。配置效果就是能够编译完用系统终端cmd运行程序,而不是用 Sublime Text 自带的终端运行,因为其自带的终端有很多不...

    Sublime Text 4 Build 4152

    Sublime Text 是一个文本编辑器(收费软件,可以无限期试用),同时也是一个先进的代码编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来,它最初被设计为一个具有丰富扩展功能的Vim。 Sublime ...

    Sublime Text快捷键

    Sublime Text快捷键,Sublime Text快捷键Sublime Text快捷键Sublime Text快捷键Sublime Text快捷键。。。。。

    【破解版】Sublime text3 破解版 免注册

    Sublime text3 破解版 免注册 Sublime text3 破解版 免注册 Sublime text3 破解版 免注册 Sublime text3 破解版 免注册 Sublime text3 破解版 免注册 Sublime text3 破解版 免注册 Sublime text3 破解版 免注册 ...

    Sublime Text4.rar

    除此之外,在sublime text4中还有着自身独特的功能,不仅可以自定义皮肤、配色方案、多种界面布局,还提供了代码地图、全屏免打扰模式、goto anything、goto definition等功能,十分优秀,并支持运行在Linux、...

    Sublime Text 3.1 3170Patch注册机

    Sublime Text 是一款轻量级的代码编辑器,也是HTML和散文先进的文本编辑器。Sublime Text 具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等。

    最新破解Sublime Text 2.0.2 x64

    Sublime Text 2 - 性感无比的代码编辑器!程序员必备神器!跨平台支持Win/Mac/Linux [ 编程开发, 编辑输入 - Windows, Mac, Linux // 2012-07-28 ] Sublime Text 2 - 性感无比的代码编辑器!程序员必备神器!跨平台...

    IDEA的SublimeText2/Text3 monokai主题配色风格

    资源中包含 sublime text2 ,sublime text3 以及一些其他的主题,各主题之间会有细微差距,各位大佬下载后可以自己去观察导入后的效果

    sublime text福利 40多个插件集合 5款主题(完美支持sublime text3和st2)

    打开sublime text3 依次点击工具栏中的preference->browse packages 到一个类似C:\Users\Adiministor\AppData\Roaming\Sublime Text 3\Packages 的目录 转到向上一级 C:\Users\Adiministor\AppData\Roaming\...

    Sublime Text 使用手册

    本文系统地介绍了Sublime Text,旨在为广大程序开发人员提供Sublime Text的简化中文教程。 本书内容由本人根据自身对原文的理解整理而来,仅部分操作做了验证;与此同时,也对Sublime Text的配置参数作了归类整理和...

    sublimetext.zip

    Sublime Text是一个代码编辑器也是HTML和散文先进的文本编辑器。漂亮的用户界面和非凡的功能,例如迷你地图,多选择,Python的插件,代码段,等等。

    Sublime Text 3 汉化包

    Sublime Text 3 汉化包

    Sublime Text3 配置编译运行C.rar

    Sublime Text3 配置编译运行C语言Sublime Text3 配置编译运行C语言

    Sublime text 2 for linux

    Sublime Text 2 for linux

    现代SublimeText3和2主题

    现代Sublime Text 3和2主题

    Sublime Text Build 3083 x86 破解版

    Sublime Text 是一个很强大的代码编辑器,此版本基于官方最新版3.83版进行了汉化破解

    Sublime Text 3

    最新版sublime text 3

    sublimeText3143 纯净版

    sublimeText3143 纯净版(32位) 只装了汉化菜单插件

    SublimeText3 Linux新版

    Sublime Text是一款流行的代码编辑器。Sublime Text 具有漂亮的用户界面和强大的功能,例如代码缩略图,Python的插件,代码段等。还可自定义键绑定,菜单和工具栏。Sublime Text 的主要功能包括:拼写检查,书签,...

    Sublime Text 3 3143安装包+注册码

    Sublime Text 3 3143安装包+注册码。有能力亲请购买支持正版。

Global site tag (gtag.js) - Google Analytics