Skip to content

Commit dc543d1

Browse files
docs(readme): update FAQ with how to preserve case of tags (#62)
1 parent 8a6589f commit dc543d1

File tree

1 file changed

+21
-0
lines changed

1 file changed

+21
-0
lines changed

README.md

+21
Original file line numberDiff line numberDiff line change
@@ -318,6 +318,27 @@ See [#158](https://github.com/remarkablemark/html-react-parser/issues/158).
318318

319319
Enable the [trim](https://github.com/remarkablemark/html-react-parser#trim) option. See [#155](https://github.com/remarkablemark/html-react-parser/issues/155).
320320

321+
#### Don't change case of tags.
322+
323+
Tags are lowercased by default. To prevent that from happening, pass the [htmlparser2 option](https://github.com/remarkablemark/html-react-parser#htmlparser2):
324+
325+
```js
326+
const options = {
327+
htmlparser2: {
328+
lowerCaseTags: false
329+
}
330+
};
331+
parse('<CustomElement>', options); // React.createElement('CustomElement')
332+
```
333+
334+
> **Warning**: By preserving case-sensitivity of the tags, you may get rendering warnings like:
335+
>
336+
> ```
337+
> Warning: <CustomElement> is using incorrect casing. Use PascalCase for React components, or lowercase for HTML elements.
338+
> ```
339+
340+
See [#62](https://github.com/remarkablemark/html-react-parser/issues/62) and [example](https://repl.it/@remarkablemark/html-react-parser-62).
341+
321342
## Benchmarks
322343
323344
```sh

0 commit comments

Comments
 (0)