1

我正在尝试使用 pugsj 添加样式属性，但我不知道如何在line-height没有我的 linter 抱怨的情况下添加样式。

我有这个哈巴狗模板（不起作用）

 Div(
  class="CoolAid"
  style={line-height:'40px', background-color: 'red'}
 )
    = childrenArray[0]

请注意，当我使用"background-color": 'red'.

yarn lint:es
 yarn run v1.6.0
$ eslint ./config ./src
Cannot read property 'split' of undefined
TypeError: Cannot read property 'split' of undefined
at TaggedTemplateExpression (/home/circleci/github/node_modules/eslint-plugin- 
react-pug/lib/rules/no-broken-template.js:33:38)
at listeners.(anonymous function).forEach.listener (/home/circleci/github/node_modules/eslint/lib/util/safe-emitter.js:47:58)
at Array.forEach (<anonymous>)
at Object.emit (/home/circleci/github/node_modules/eslint/lib/util/safe-emitter.js:47:38)
at NodeEventGenerator.applySelector (/home/circleci/github/node_modules/eslint/lib/util/node-event-generator.js:251:26)
at NodeEventGenerator.applySelectors (/home/circleci/github/node_modules/eslint/lib/util/node-event-generator.js:280:22)
at NodeEventGenerator.enterNode (/home/circleci/github/node_modules/eslint/lib/util/node-event-generator.js:294:14)
at CodePathAnalyzer.enterNode (/home/circleci/github/node_modules/eslint/lib/code-path-analysis/code-path-analyzer.js:608:23)
at Traverser.enter [as _enter] (/home/circleci/github/node_modules/eslint/lib/linter.js:865:28)
at Traverser._traverse (/home/circleci/github/node_modules/eslint/lib/util/traverser.js:132:14)

错误命令失败，退出代码为 1。

[eslint] Pug can't parse this template (react-pug/no-broken-template)

这些是我使用的 pug/eslint 相关包

"eslint-plugin-react": "^7.4.0",
"eslint-plugin-react-pug": "^0.3.0",
"babel-plugin-transform-react-pug": "^5.0.0",
"eslint": "^4.19.1",
4

1 回答 1

1

这是执行此操作的方法：

 .CoolAid(style="{line-height:'40px', background-color: 'red'}")= childrenArray[0]

这将产生以下标签：

<div class="CoolAid" style="{line-height:'40px', background-color: 'red'}">
  {{childrenArray[0]}}
</div>
于 2018-10-07T01:06:11.737 回答