javascript - 在 react 中使用 pug 和 sass

Question

我可以在 react 中使用 pug/jade 和 sass 吗？

实际上我喜欢分开文件，我喜欢用 sass 和 pug 可以为我做的方式对代码进行分类，这很棒。

有什么办法可以在 React 中使用 pug 和 sass 吗？

哈巴狗示例:

doctype html
html(lang="en", dir="ltr" , xmlns="http://www.w3.org/1999/xhtml" , prefix="og: http://ogp.me/ns# fb:http://ogp.me/ns/fb#")
  head
    meta(charset="utf-8")
    link(rel="stylesheet" , href="style.css")
  body
    p.a minim tamen labore cillum aute nulla quis anim anim summis
    ul
      each val in('one','two','three')
        li
          a(href="#",target="_blank")=val

Answer 1

是的，您可以在 React 组件中使用 Scss。您必须使用适当的加载程序才能这样做。 sass-loader 它就是您要找的那个:https://github.com/webpack-contrib/sass-loader这样你就可以使用


导入“./styles.scss”；


组件的标记必须用 JSX(HTML 和 JavaScript 的混合体)编写。但是你可以在你的入口 HTML 文件中使用 pug，它会包含你的 React 包。

索引.pug

body
    #root

script(src="path/to/bundle.js")