正在阅读:使用HBuilder开发前必做的几件事使用HBuilder开发前必做的几件事

2019-01-29 15:05 出处:其他 作者:佚名 责任编辑:lixianmei

  前端IDE HBuilder还是很受欢迎的,在开始进行开发之前,这几件事可能是你有必要完成的。这里先列出来先:

  1. 集成终端(cmd.exe);

  2. 写自定义代码段;

  3. 常用文件类型模板制作;

  4. 部署外置服务器

  5. FTP/Git等设置;

  方法/步骤

  现在的前端开发都进入了自动化/模块化开发了,包括文件编译/打包/同步都依赖插件自动化完成。没有终端cmd.exe的话工作起来不够方便。所以下载HBuilder之后的第一件事建议先集成终端程序。这一步我已经在另外一篇经验里写怎么设置了,下面附上经验链接:

hbuilder

  自定义代码段是快速输入的一个途径,相较之下HBuilder的代码提示支持的语言还是有点少,如果有自己需要无数次重复使用的代码段,设置成代码段提示是最佳的选择。下面开始:

  1. 工具——>扩展代码块——(选择你需要自定义的文件类型,如:自定义js代码块)

hbuilder

  2. 在弹出的界面就可以开始了,HBuilder官方的注释已经很清楚了,按照模板来就好。原先的示例可以全部注释掉,然后加上自己的。写完保存就可以立马生效了。我写了一段给gulpfile.js用的代码块,如下:

  #*********** FOR gulpfile.js begin**************

    # for gulp require()

      snippet "var pluginname = require('gulp-pluginname')" do |s|

      s.trigger = "gv"

      s.expansion = "var $1 = require('gulp-$0');"                    

      end

    # for gulp gulp.task('',fn)

      snippet "gulp.task('name',fn)" do |s|

      s.trigger = "gt"

      s.expansion = "gulp.task('$1',function(){

        gulp.src('$0')

            .pipe()

    });"

      end

      #for gulp.src('')

        snippet "gulp.src('path')" do |s|

      s.trigger = "gs"

      s.expansion = "gulp.src('$1')

        .pipe($0)"

      end

      #for gulp.dest('')

        snippet ".pipe(gulp.dest('path'))" do |s|

      s.trigger = "gd"

      s.expansion = ".pipe(gulp.dest('$1'))

    $0"

      end

      #for gulp.watch('',[''])

        snippet "gulp.watch('taskName',['taskName']);" do |s|

      s.trigger = "gw"

      s.expansion = "gulp.watch('$1',['$0']);"

      end

      #for gulp.task(''fn(){gulp.watch('',[fn])})

        snippet "gulp.task('taskName',function(){

        gulp.watch('',['taskName']);

    });" do |s|

      s.trigger = "gtw"

      s.expansion = "gulp.task('$1',function(){

        gulp.watch('$0',['']);

    });"

      end

      #for gulp.pipe()

        snippet ".pipe()" do |s|

      s.trigger = "gp"

      s.expansion = ".pipe($1)

    $0"

      end

      # for gulp .pipe(pluginname({option}))

        snippet ".pipe(pluginname({option}))" do |s|

      s.trigger = "gpo"

      s.expansion = ".pipe($1({$0}))

        .pipe()"

      end

      #for gulp default task

        snippet "gulp.task('default',['taskName'])" do |s|

      s.trigger = "gtd"

      s.expansion = "gulp.task('default',['$1']);

    $0"

    #*************** FOR gulpfile.js end**************

Hbuilder系列软件最新版本下载
Hbuilder软件版本:9.1.19 正式版编程开发立即查看
HBuilder软件版本:5.5.1Android软件立即查看

关注我们

最新资讯离线随时看 聊天吐槽赢奖品