引入全局样式不生效怎么解决？
niujunhui opened this issue · comments
@niujunhui 是在 app.js 中添加的全局样式在 h5 环境中不生效么？我需要更多的上下文信息，最好是给出实际的代码。
@niujunhui 是在 app.js 中添加的全局样式在 h5 环境中不生效么？我需要更多的上下文信息，最好是给出实际的代码。
对的，在taro项目app.js文件里引入的全局样式，next编译后不生效
@niujunhui 是 styles/index.less 中的样式没有生效么？还是 assets/font/iconfont.css 中的样式也没有生效？
@niujunhui 是 styles/index.less 中的样式没有生效么？还是 assets/font/iconfont.css 中的样式也没有生效？
都不生效的
@lzl-anonym 好的，请给出 taro 版本和插件版本，我尝试复现一下。
@lzl-anonym 好的，请给出 taro 版本和插件版本，我尝试复现一下。
taro-v3.6.11
tarojs-plugin-platform-nextjs": "^2.1.2"
taro-v3.6.11
tarojs-plugin-platform-nextjs": "^2.1.2"
如果你在控制台也存错误信息 The current version of Next.js cannot support Less, please feed back on the issue of github.，如下图所示，表明当前插件内部适配 less 的库与你正在使用 next.js 版本不匹配。
你临时选择通过强制锁定 next-with-less 这个包的版本来解决这个问题，例如下面是 yarn 的做法：
"resolutions": {
"next-with-less": "^3.0.0"
}之后我将尝试修复这个问题。
如果你在控制台也存错误信息
The current version of Next.js cannot support Less, please feed back on the issue of github.，如下图所示，表明当前插件内部适配 less 的库与你正在使用 next.js 版本不匹配。你临时选择通过强制锁定 `next-with-less` 这个包的版本来解决这个问题，例如下面是 yarn 的做法：
"resolutions": { "next-with-less": "^3.0.0" }之后我将尝试修复这个问题。
我那边用了这个插件next-with-less，所以项目是支持less的。主要问题还是全局样式引入失效，但是目前在next编译后的_app.js文件里手动引入进去是可以的，有没有更好的方式解决呢？
你使用的是 Windows 电脑么？
…
________________________________ 发件人: niujunhui @.> 发送时间: Saturday, November 11, 2023 3:27:04 PM 收件人: NervJS/tarojs-plugin-ssr @.> 抄送: Cong-Cong Pan @.>; Comment @.> 主题: Re: [NervJS/tarojs-plugin-ssr] 引入全局样式不生效怎么解决？ (Issue #35) 如果你在控制台也存错误信息 The current version of Next.js cannot support Less, please feed back on the issue of github.，如下图所示，表明当前插件内部适配 less 的库与你正在使用 next.js 版本不匹配。 [image]https://user-images.githubusercontent.com/19852293/282226827-5dc69640-85fd-4fe2-a17f-beaa460614ad.png 你临时选择通过强制锁定next-with-less这个包的版本来解决这个问题，例如下面是 yarn 的做法： "resolutions": { "next-with-less": "^3.0.0" } 之后我将尝试修复这个问题。 我那边用了这个插件next-with-less，所以项目是支持less的。主要问题还是全局样式引入失效，但是目前在next编译后的_app.js文件里手动引入进去是可以的，有没有更好的方式解决呢？ ― Reply to this email directly, view it on GitHub<#35 (comment)>, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AEXOYBL7PPQ7P42ZMANS4UTYD4SERAVCNFSM6AAAAAA7FRYSFKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQMBWG4ZTANBYHA. You are receiving this because you commented.Message ID: @.***>
是的
ok，Windows 电脑确实存在别的问题，我今天晚上修复，并发布一个新的版本。
…
________________________________ 发件人: niujunhui @.> 发送时间: Saturday, November 11, 2023 3:56:34 PM 收件人: NervJS/tarojs-plugin-ssr @.> 抄送: Cong-Cong Pan @.>; Comment @.> 主题: Re: [NervJS/tarojs-plugin-ssr] 引入全局样式不生效怎么解决？ (Issue #35) 你使用的是 Windows 电脑么？ …
________________________________ 发件人: niujunhui @.> 发送时间: Saturday, November 11, 2023 3:27:04 PM 收件人: NervJS/tarojs-plugin-ssr @.> 抄送: Cong-Cong Pan @.>; Comment @.> 主题: Re: [NervJS/tarojs-plugin-ssr] 引入全局样式不生效怎么解决？ (Issue #35<#35>) 如果你在控制台也存错误信息 The current version of Next.js cannot support Less, please feed back on the issue of github.，如下图所示，表明当前插件内部适配 less 的库与你正在使用 next.js 版本不匹配。 [image]https://user-images.githubusercontent.com/19852293/282226827-5dc69640-85fd-4fe2-a17f-beaa460614ad.png 你临时选择通过强制锁定 next-with-less 这个包的版本来解决这个问题，例如下面是 yarn 的做法： "resolutions": { "next-with-less": "^3.0.0" } 之后我将尝试修复这个问题。 我那边用了这个插件next-with-less，所以项目是支持less的。主要问题还是全局样式引入失效，但是目前在next编译后的_app.js文件里手动引入进去是可以的，有没有更好的方式解决呢？ D Reply to this email directly, view it on GitHub<#35 (comment)<#35 (comment)>>, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AEXOYBL7PPQ7P42ZMANS4UTYD4SERAVCNFSM6AAAAAA7FRYSFKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQMBWG4ZTANBYHA. You are receiving this because you commented.Message ID: @.> 是的 ― Reply to this email directly, view it on GitHub<#35 (comment)>, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AEXOYBNJHH6XTFQRZC27K2TYD4VTFAVCNFSM6AAAAAA7FRYSFKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQMBWG4ZTMOJRHA. You are receiving this because you commented.Message ID: @.>
好的，感谢你，抽时间回复。
@niujunhui 我发布了2.1.3 版本，你可以升级到这个版本尝试一下。
@niujunhui 我发布了2.1.3 版本，你可以升级到这个版本尝试一下。
升级完全局样式依然不生效，我react用的18，next.js12和13都不行，taro v3.6.11我不确定是依赖项的问题还是什么问题
@niujunhui 那可能就有些棘手了，可以做下面的尝试。
根据你描述和我在 windows 电脑上复现来看，问题是处理全局 css 的 babel 插件无法正常工作，它无法正确判断当前处理的文件是否是 next.js 的 _app.js 文件。
所以我进行了如下修复 71724ea ，你可以通过 debug 或者通过 console.log 等方式，判断在 next.js 启动时该插件是否正常执行。