@a-la/source-map-generator 中文文档教程

Question

@a-la/source-map-generator

@a-la/source-map-generator 是一个 fork Mozilla/SourceMap 生成源映射并与 Google Closure 编译器一起工作。 它用 ES6 语法重写，并为编译提供了 GCC 的 externs。

yarn add @a-la/source-map-generator

Table Of Contents

• Table Of Contents
• API
• class SourceMapGenerator
• constructor(conf: Config): SourceMapGenerator
  • _sourceMapGenerator.Config
• Copyright

API

该包可通过导入其默认函数获得：

import sourceMapGenerator from '@a-la/source-map-generator'

class SourceMapGenerator

SourceMapGenerator 的一个实例表示正在增量构建的源地图。

暂时删除的方法

• [x] static fromSourceMap
• [x] applySourceMap

<ins>constructor</ins>(
  conf: Config,
): <i>SourceMapGenerator</i>

调用构造方法来创建新的源映射。

_sourceMapGenerator.Config：程序的选项。

Name	Type	Description	Default
file	string	The filename of the generated source.	-
sourceRoot	string	A root for all relative URLs in this source map.	-
skipValidation	boolean	When true, disables validation of mappings as they are added. This can improve performance but should be used with discretion, as a last resort. Even then, one should avoid using this flag when running tests, if possible.	false

import SourceMapGenerator from '@a-la/source-map-generator'
import { readFileSync } from 'fs'

const file = `${readFileSync(__filename)}`

const gen = new SourceMapGenerator({
  file: 'example/index.js',
})
/**
 * Generate the source map for the file, keeping all positions as they are.
 *
 * The first two rules will update inline and block comments to not have any tokens in them.
 * The third rule will break each line into tokens and add mappings.
 */
const linesInSource = file
  .replace(/\/\*(?:[\s\S]+?)\*\//g, (match, pos) => {
    const next = file[pos + match.length]
    if (next == '\n') return '\n'.repeat(match.split('\n').length - 1)

    const lines = match.split('\n')
    const lastLineI = lines.length - 1
    const lastLine = lines[lastLineI]
    const ss = ' '.repeat(lastLine.length)
    const ws = '\n'.repeat(lastLineI)
    return `${ws}${ss}`
  })
  .replace(/\/\/(.+)/gm, (match) => {
    return ' '.repeat(match.length)
  })
  .split('\n')
linesInSource.forEach((l, i) => {
  const line = i + 1
  l
    .replace(/(?:(?:\s+)|(?:[$_\w\d]+)|.)/g, (match, column) => {
      if (column == 0 && /^\s+$/.test(match)) return
      const generated = {
        line,
        column,
      }
      const m = {
        generated,
        source: __filename,
        original: generated,
      }
      gen.addMapping(m)
    })
})
gen.setSourceContent(__filename, file)
const sourceMap = gen.toJSON()
console.log(sourceMap)

{ version: 3,
  sources: [ '/Users/zavr/a-la/source-map-generator/example/index.js' ],
  names: [],
  mappings: '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',
  file: 'example/index.js',
  sourcesContent: 
   [ 'import SourceMapGenerator from \'../src\'\nimport { readFileSync } from \'fs\'\n\nconst file = `${readFileSync(__filename)}`\n\nconst gen = new SourceMapGenerator({\n  file: \'example/index.js\',\n})\n/**\n * Generate the source map for the file, keeping all positions as they are.\n *\n * The first two rules will update inline and block comments to not have any tokens in them.\n * The third rule will break each line into tokens and add mappings.\n */\nconst linesInSource = file\n  .replace(/\\/\\*(?:[\\s\\S]+?)\\*\\//g, (match, pos) => {\n    const next = file[pos + match.length]\n    if (next == \'\\n\') return \'\\n\'.repeat(match.split(\'\\n\').length - 1)\n\n    const lines = match.split(\'\\n\')\n    const lastLineI = lines.length - 1\n    const lastLine = lines[lastLineI]\n    const ss = \' \'.repeat(lastLine.length)\n    const ws = \'\\n\'.repeat(lastLineI)\n    return `${ws}${ss}`\n  })\n  .replace(/\\/\\/(.+)/gm, (match) => {\n    return \' \'.repeat(match.length)\n  })\n  .split(\'\\n\')\nlinesInSource.forEach((l, i) => {\n  const line = i + 1\n  l\n    .replace(/(?:(?:\\s+)|(?:[$_\\w\\d]+)|.)/g, (match, column) => {\n      if (column == 0 && /^\\s+$/.test(match)) return\n      const generated = {\n        line,\n        column,\n      }\n      const m = {\n        generated,\n        source: __filename,\n        original: generated,\n      }\n      gen.addMapping(m)\n    })\n})\ngen.setSourceContent(__filename, file)\nconst sourceMap = gen.toJSON()\nconsole.log(sourceMap)' ] }

Copyright

原作者：Mozilla

---

	© Art Deco for À La Mode 2019		Tech Nation Visa Sucks