kuaifan / eeui

📱 使用 Vue.js 跨平台开发高质量原生(Android/iOS)应用。
https://eeui.app/
MIT License
531 stars 53 forks source link

建议添加支持pug #39

Closed yangtenghuan closed 4 years ago

yangtenghuan commented 5 years ago

求支持引入pug模板引擎,写原生html痛不欲生

在weex中无需任何配置可以直接使用pug,按理做了上层封装的eeui应该可以使用才对



抓光了头发的情况下已找到解决方法:

进入c:/user/xxx/AppData/Roaming/npm/node_modules/eeui-cli,在eeui脚手架中自行安装pug:

`npm i pug`

还是希望官方后续可以优化一下
akFace commented 5 years ago

这个支持的

akFace commented 5 years ago
1、安装 npm install less less-loader --save

2、使用
<style scoped lang="less">
</style>

注:weex不支持嵌套写法

错误写法
.box{
  background-color: pink;
  .a {
    color: red;
 }
}
正确写法
.box{
  background-color: pink;
}
.a {
    color: red;
 }
yangtenghuan commented 5 years ago
1、安装 npm install less less-loader --save

2、使用
<style scoped lang="less">
</style>

注:weex不支持嵌套写法

错误写法
.box{
  background-color: pink;
  .a {
    color: red;
 }
}
正确写法
.box{
  background-color: pink;
}
.a {
    color: red;
 }

请问如何引入 pug ?

akFace commented 5 years ago

没用过pug :smile:

neterji commented 4 years ago

1、安装 npm install less less-loader --save

2、使用


注:weex不支持嵌套写法
```css
错误写法
.box{
  background-color: pink;
  .a {
    color: red;
 }
}
正确写法
.box{
  background-color: pink;
}
.a {
    color: red;
 }

那和直接写css有啥区别?

akFace commented 4 years ago

@neterji 可以用来做公共类、公共样式

yangtenghuan commented 4 years ago

自己修改 webpack.config.js 添加 rules会报错

module.exports = {
  module: {
    rules: [
      { test: /\.pug$/, loader: "pug-plain-loader" }
    ]
  }
};
Error: Rule can only have one result source (provided use and loader) in {
  "test": {},
  "use": [
    {
      "loader": "babel-loader",
      "options": {
        "presets": [
          "@babel/react",
          "@babel/env"
        ],
        "plugins": [
          [
            "@babel/transform-runtime",
            {
              "helpers": false
            }
          ],
          [
            "component",
            {
              "libraryName": "weex-ui",
              "libDir": "packages",
              "style": false
            },
            "weex-ui"
          ],
          [
            "component",
            {
              "libraryName": "eeui-design",
              "libDir": "packages",
              "style": false
            },
            "eeui-design"
          ]
        ]
      }
    }
  ],
  "loader": "pug--plain-loader"
}
monkey01127 commented 4 years ago

eeui 如何引入Pug,能否给出大致的方式呀?

yangtenghuan commented 4 years ago

eeui 如何引入Pug,能否给出大致的方式呀?

我在上面已经说得很清楚了吧,安装完就可以直接用,不用引入