search

SolidZORO / next-plugin-antd-less

🎩 Use Antd (Less) with Next.js v12, Zero Dependency on other Next-Plugins.
MIT License
345 stars 48 forks source link

Support Fast Refresh when changing theme variables #6

Closed llamadeus closed 3 years ago

llamadeus commented 3 years ago

It would be great if changes to the less variables file would be applied without having to restart the development server. I could offer some help here if desired.

SolidZORO commented 3 years ago

sound good, how?

llamadeus commented 3 years ago

Instead of passing the theme variables via modifyVars to less-loader it is possible to use appendData(loaderContext) in 6.x (or additionalData(content, loaderContext) in 7.x) to append code to each less file.

Modifying the less-loader options object like this already solves this problem.

options: {
  lessOptions: {
    javascriptEnabled: true,
  },
  appendData(loaderContext) {
    if (nextConfig.lessVarsFilePath) {
      const varsFilePath = path.join(loaderContext.rootContext, nextConfig.lessVarsFilePath);

      return `@import "${varsFilePath}";`;
    }
  },
},
SolidZORO commented 3 years ago

great, I will try it in my next next.js project and update the plugin.

SolidZORO commented 3 years ago

@llamadeus thank your suggest! Support Hot Update style after modifying Antd less variables since 1.0.