weex-loader中怎么配置sass,stylus,less

发布于 2022-09-04 13:53:14 字数 227 浏览 29 评论 0

按照vue的做法还是不行

  test: /\.vue$/,
  loader: 'weex-loader',
  options: {
    loaders: {
      css: ['weex-style', 'css-loader'],
      stylus: ['weex-style', 'css-loader', 'stylus-loader']
    }
  }

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

终陌 2022-09-11 13:53:14

感谢大家的回答,昨天研究了weex-loader原码,发现在vue文件中不需要配置即可使用各种预处理器,只要在<style>中用lang="XX"指出就可以了。
@hayvane 的这种在native端是无用的,因为weex-loader会将css处理成json加载到模块style属性中。必须要使用'weex-vue-loader/lib/style-loader.js'来进行处理。
在native端的Css处理完全不是web端的概念,所以并不存在全局引用样式,也就是并不需要引入.sass.less.styl文件。
要实现样式的复用,最终实践出两种方法,一种是在vue中多加一个style标签

<style src="../assets/main.css"></style>

第二种方法是使用预处理器进行导入

<style lang="stylus">
    @import "../assets/main.css"
    
    ...

</style>
傲鸠 2022-09-11 13:53:14

刚用wexx,折腾了下可以了,最新版在vue-loader.conf.js 加上如下

module.exports = (options) => {
    return {
        loaders: utils.cssLoaders({
            // sourceMap: use sourcemao or not.
            sourceMap: options && sourceMapEnabled,
            // useVue: use vue-style-loader or not
            useVue: options && options.useVue,
            // usePostCSS: use postcss to compile styles.
            usePostCSS: options && options.usePostCSS
        }),
        cssSourceMap: sourceMapEnabled,
        cacheBusting: config.dev.cacheBusting,
        lang: {
            scss: ['sass-loader']
        }
    }
}
ゞ花落谁相伴 2022-09-11 13:53:14
{
    module: {
        loaders: [{
            test: /\.vue$/,
            loader: 'weex-loader',
            options: {
                loaders: {
                    css: ['weex-style', 'css-loader'],
                    stylus: ['weex-style', 'css-loader', 'stylus-loader']
                }
            }
        }]
    },
    weex: {
        lang: {
            css: ['weex-style', 'css-loader'],
            stylus: ['weex-style', 'css-loader', 'stylus-loader']
        }
    }
}
冷夜 2022-09-11 13:53:14

我现在使用的是sass,没有使用stylus,配置如下;

package.json 的dev 中加入:
"node-sass": "^4.5.0",
"sass-loader": "^6.0.1",


webpack.config.js中的module:
module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel-loader',
                exclude: /node_modules/
            },
            {
                test: /\.css$/, loader: 'style-loader!css-loader'
            },
            { 
                test: /\.(scss|sass)$/, loader: 'style-loader!css-loader!sass-loader'
            },
            {
                test: /\.(we|vue)(\?[^?]+)?$/,
                loader: loader + '-loader'
            }
        ]
    },
仙气飘飘 2022-09-11 13:53:14

配置stylus的时候还是报错了

clipboard.png

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文