Parser下載 - Parser源代碼下載

Parser

其他類別

1.0.0

下載

配x警告：該項目已在npmjs.com上從"dss"轉移到"@documented-style-sheets/parser"

DSS ，有記錄的樣式表是通用評論指南和解析器（例如，CSS，LISNES，手寫筆，SASS，SASS，SCSS＆JS評論）。該項目進行靜態文件分析和解析以生成用於生成styleGuides的對象。

安裝

npm i @documented-style-sheets/parser

解析文件

在大多數情況下，您將需要將DSS解析器包含在構建步驟中，該步驟將自動生成文檔文件（或者您只想使用此返回的Object來播放以獲取其他方式）；無論哪種方式，我們都會正式支持Grunt插件和Gulp插件。

例子

示例評論塊格式

 //
// @name Button
// @description Your standard form button.
// 
// @state :hover - Highlights when hovering.
// @state :disabled - Dims the button when disabled.
// @state .primary - Indicates button is the primary action.
// @state .smaller - A smaller button
// 
// @markup
//   <button>This is a button</button>
//

示例用法

 // Requirements
const fs = require ( 'fs' )
const { parse } = require ( '@documented-style-sheets/parser' )

// Get file contents
const fileContents = fs . readFileSync ( 'styles.css' )

// Run the DSS Parser on the file contents
parse ( fileContents , { } , function ( parsedObject ) {
  // Output the parsed document
  console . log ( parsedObject )
} )

示例輸出

{
  "name" : " Button " ,
  "description" : " Your standard form button. " ,
  "state" : [
    { 
      "name" : " :hover " ,
      "escaped" : " pseudo-class-hover " ,
      "description" : " Highlights when hovering. "
    },
    {
      "name" : " :disabled " ,
      "escaped" : " pseudo-class-disabled " ,
      "description" : " Dims the button when disabled. "
    },
    {
      "name" : " .primary " ,
      "escaped" : " primary " ,
      "description" : " Indicates button is the primary action. "
    },
    {
      "name" : " .smaller " ,
      "escaped" : " smaller " ,
      "description" : " A smaller button "
    }
  ],
  "markup" : {
    "example" : " <button>This is a button</button> " ,
    "escaped" : " &lt;button&gt;This is a button&lt;/button&gt; "
  }
}

dss.detector（<Callback>）

該方法定義了在文本行中找到感興趣點（即變量）的方式，然後被解析。 DSS Dogfoods此API和默認實現如下所示。

默認檢測器：

 // Describe default detection pattern
// Note: the current line, as a string, is passed to this function
const dss = require ( '@documented-style-sheets/parser' )
dss . detector ( function ( line ) {
  if ( typeof line !== 'string' ) {
    return false
  }
  var reference = line . split ( "nn" ) . pop ( )
  return ! ! reference . match ( / .*@ / )
} )

dss . parse ( ... )

dss.parser（<名稱>，<Callback>）

默認情況下， DSS包括4個解析器，用於評論塊的name ， description ， state和markup 。您可以通過註冊新解析器來添加或覆蓋這些默認值。這些默認值還遵循一種模式，該模式使用@ Decorator來識別它們。您可以修改此BehaiVour，為dss.detector()提供不同的回調函數。

dss.parser期望您要尋找的變量的名稱和一個回調功能來操縱內容。該回調函數返回的任何內容都是生成JSON中使用的內容。

回調`this` ：

this.file ：當前文件
this.name ：解析器的名稱
this.options ：最初傳遞給dss.parse()選項
this.line ：
- this.line.contents ：與此變量關聯的內容
- this.line.from ：找到此變量的行號
- this.line.to ：該變量內容結束的行號
this.block ：
- this.block.contents ：與此變量的評論塊相關的內容
- this.block.from ：該變量的評論塊啟動的行號
- this.block.to ：該變量的評論塊結束的行號

自定義解析器示例：

 // Matches @version
dss . parser ( 'version' , function ( ) {
  // Just returns the lines contents
  return this . line . contents
} )

 dss . parser ( 'link' , function ( ) {
  // Replace link with HTML wrapped version
  const exp = / (b(https?|ftp|file): / / [ - A - Z0 - 9 + & @# / % ? = ~ _ | ! : , . ; ] * [ - A - Z0 - 9 + & @# / %= ~ _ | ] ) / ig
  this . line . contents . replace ( exp , "<a href='$1'>$1</a>" )
  return line
} )