多个组件引用同一个样式文件的问题。

nicefan commented 7 years ago

在多个vue文件中使用方式，在打包后的源码会生成多个同样内容的module，造成比较严重的代码冗余。

Hanks10100 commented 7 years ago

的确，因为样式默认都是以 scoped 的方式引入的，虽然名称一样，但是作用域只在当前组件范围内，只能复制。

目前 Weex 还不支持全局样式，这方面后续会考虑。

nicefan commented 7 years ago

因为我看到生成的代码

/ styles / vue_styles.push(webpack_require(152) )

在weex中style都是模块形式引用到对应的view中的，这和作用域没有什么关系啊，

既然我们在不同的组件中引用同一个图片,生成代码中也只会生成一个base64的模块，原理是一样的吧！

发件人: Hanks notifications@github.com 发送时间: 2017年7月7日 15:57:26 收件人: weexteam/weex-loader 抄送: nicefan; Author 主题: Re: [weexteam/weex-loader] 多个组件引用同一个样式文件的问题。 (#57)

的确，因为样式默认都是以 scoped 的方式引入的，虽然名称一样，但是作用域只在当前组件范围内，只能复制。

目前 Weex 还不支持全局样式，这方面后续会考虑。

― You are receiving this because you authored the thread. Reply to this email directly, view it on GitHubhttps://github.com/weexteam/weex-loader/issues/57#issuecomment-313614332, or mute the threadhttps://github.com/notifications/unsubscribe-auth/APEH_S7VCCVPlvmVe7W9siKm7PaA35r0ks5sLeTmgaJpZM4OPcnm.

Hanks10100 commented 7 years ago

生成后的代码不好解释清楚，Weex 在客户端上对样式的处理方式不同，会把类名对应的样式内联到组件上（web 上只需指定 class list），这个过程就会把样式拷贝多份，相关的样式可以理解为就是组件级别的作用域。

nicefan commented 7 years ago

没错啊，每个view都会有一个__vue_styles__的数组，然后将要用的class push进来的。就是因为和web不一样，所以才不存在组件范围的问题

nicefan commented 7 years ago

modlues = [ function () { return {
"text-main": {"color": "#fddc3f"} }, function () { return {
"text-main": {"color": "#fddc3f"} } ] view1.style.push(modules[0]()) view2.style.push(modules[1]()

modules[0]和modules[1]有区别吗？

apache / incubator-weex-loader

多个组件引用同一个样式文件的问题。 #57