2

我正在尝试为 redux 容器文件创建一个片段,该文件需要导入一些具有相同基本名称的反应文件。TM_FILENAME_BASE 非常适合从文件名中删除 .js,但在这种情况下,我的组件文件的扩展名是 fun-thing.component.js,并且容器将使用扩展名 fun-thing.container.js。

我用来在第一个时期之前选择所有内容的正则表达式是^([^.]+)

  "Redux Container": {
    "prefix": "rc",
    "body": [
      "// @flow",
      "import { connect } from 'react-redux';",
      "import { ${TM_FILENAME/^([^.]+)/${1:/pascalcase}/}Component } from './${TM_FILENAME/^([^.]+)/$1/}.component';",
      "",
      "const mapStateToProps = (state) => ({});",
      "",
      "const mapDispatchToProps = {};",
      "",
      "export const ${TM_FILENAME/^([^.]+)/${1:/pascalcase}/} = connect(",
      "  mapStateToProps,",
      "  mapDispatchToProps",
      ")(${TM_FILENAME/^([^.]+)/${1:/pascalcase}/}Component);"
    ],
    "description": "Creates a normal container for a normal component"
  }

预期的

// @flow
import { connect } from 'react-redux';
import { FunThingComponent } from './fun-thing.component';
...

实际的

// @flow
import { connect } from 'react-redux';
import { FunThing.container.jsComponent } from './FunThing.container.js.component';
...

如您所见,它没有省略文件扩展名。

4

1 回答 1

3

这两项工作:

  "import { ${TM_FILENAME/^([^.]+).*/${1:/pascalcase}/}Component } from './${TM_FILENAME/^([^.]+).*/$1/}.component';",

  "import { ${TM_FILENAME/(.*?)\\..+/${1:/pascalcase}/}Component } from './${TM_FILENAME/(.*?)\\..+/$1/}.component';"

使用 vscode 片段转换,如果您想根据需要排除部分变量,.component.js从文件名中删除 ,那么必须在正则表达式中考虑该部分变量 - 因此 (.*?)\\..+.

否则,变量的“看不见”部分就会通过。

因此,您的正则表达式^([^.]+)在第一个之前准确地捕获了文件名的一部分,.但随后变量的其余部分未经修改就“通过”了。

您可以通过以下示例更清楚地看到这一点:

"import { ${TM_FILENAME//${1:/pascalcase}/}Component }

产生:

import { fun-thing.component.jsComponent }

所以整个文件名都通过了,尽管没有一个被捕获。

${someVariable/everything To Be Transformed/what To Do To the previous/}

如果它不在“要转换的一切”部分,则不会发生任何事情。

于 2019-07-01T20:06:12.493 回答