代码之家  ›  专栏  ›  技术社区  ›  AA.

如何将flowtype与spacemacs集成

  •  11
  • AA.  · 技术社区  · 9 年前

    我是 spacemacs 迷我想用 Facebook Flow 但我不知道如何将其与spacemacs集成。我正在使用流 nuclide 但我需要重新学习一切才能提高效率。有 this script 在…上 flow 用于emacs的存储库。我需要一份如何在spacemacs中使用它的指南。

    谢谢

    2 回复  |  直到 9 年前
        1
  •  9
  •   saltycrane    9 年前

    我在这里使用了Bodil的流flycheck配置: https://github.com/bodil/emacs.d/blob/d28264cf072bb8a62459a48813d0cb30804b4f5b/bodil/bodil-js.el#L121-L154

    我用spacemacs做的 react-mode 并通过将以下内容添加到我的 dotspacemacs/user-config ( https://github.com/saltycrane/.spacemacs.d/blob/9d985ace9251529c2b8d7857e2ec9835b103084c/init.el#L383-L414 ):

    ;; Flow (JS) flycheck config (http://flowtype.org)
    ;; from https://github.com/bodil/emacs.d/blob/master/bodil/bodil-js.el
    (require 'f)
    (require 'json)
    (require 'flycheck)
    
    (defun flycheck-parse-flow (output checker buffer)
      (let ((json-array-type 'list))
        (let ((o (json-read-from-string output)))
          (mapcar #'(lambda (errp)
                      (let ((err (cadr (assoc 'message errp))))
                        (flycheck-error-new
                         :line (cdr (assoc 'line err))
                         :column (cdr (assoc 'start err))
                         :level 'error
                         :message (cdr (assoc 'descr err))
                         :filename (f-relative
                                    (cdr (assoc 'path err))
                                    (f-dirname (file-truename
                                                (buffer-file-name))))
                         :buffer buffer
                         :checker checker)))
                  (cdr (assoc 'errors o))))))
    
    (flycheck-define-checker javascript-flow
      "Javascript type checking using Flow."
      :command ("flow" "--json" source-original)
      :error-parser flycheck-parse-flow
      :modes react-mode
      :next-checkers ((error . javascript-eslint))
      )
    (add-to-list 'flycheck-checkers 'javascript-flow)
    

    另外,请确保已安装Flow命令行工具。安装方式如下:

    npm install -g flow-bin
    

    我认为Bodil打算使消息简短,但我希望flycheck显示更详细的消息。如果有人知道如何做到这一点,我将不胜感激。

    编辑2016-08-12:我发布的原始版本给出了 Symbol's function definition is void: flycheck-define-checker 初始加载错误。我更新了上面的代码以添加 require 'flycheck 来消除这个错误。

        2
  •  0
  •   Jakob Lind    9 年前

    盐渍土的回答对我来说很好。谢谢!正如他指出的那样,解决方案给出了一条非常短的错误消息。我已经改进了错误消息,使其更加详细,看起来更像flow-cli输出的输出。

    要使用此脚本的新用户需要注意的是,请确保您在中编辑它以使用正确的模式 flycheck-define-checker 在底部。我用这个 js2-mode 和盐渍起重机使用 react-mode 。编辑它以使用您正在使用的任何内容。

    (require 'f)
    (require 'json)
    (require 'flycheck)
    (defun flycheck-parse-flow (output checker buffer)
      (let ((json-array-type 'list))
        (let ((o (json-read-from-string output)))
          (mapcar #'(lambda (errp)
                      (let ((err (cadr (assoc 'message errp)))
                            (err2 (cadr (cdr (assoc 'message errp)))))
                        (flycheck-error-new
                         :line (cdr (assoc 'line err))
                         :column (cdr (assoc 'start err))
                         :level 'error
                         :message (concat (cdr (assoc 'descr err)) ". " (cdr (assoc 'descr err2)))
                         :filename (f-relative
                                    (cdr (assoc 'path err))
                                    (f-dirname (file-truename
                                                (buffer-file-name))))
                         :buffer buffer
                         :checker checker)))
                  (cdr (assoc 'errors o))))))
    
    (flycheck-define-checker javascript-flow
      "Static type checking using Flow."
      :command ("flow" "--json" source-original)
      :error-parser flycheck-parse-flow
      :modes js2-mode)
    (add-to-list 'flycheck-checkers 'javascript-flow)