module-builder icon indicating copy to clipboard operation
module-builder copied to clipboard

Option to disable sass compilation

Open dvdmlln opened this issue 1 year ago • 9 comments

Hi,

I've build a module containing custom components along with global sass variables with default values. A project that uses this module can overwrite the default sass values and the module components use the new values. However with module-builder ^0.2.1 sass is compiled to css and the former sass variables are now fixed values. So for now I use fixed version 0.2.0 or did I miss a option to disable sass compilation?

Best regards, David

dvdmlln avatar Jan 27 '23 10:01 dvdmlln

Any news about this? Looks like the upstream issues have been solved!

ennioVisco avatar Aug 13 '23 22:08 ennioVisco

Should be available since https://github.com/unjs/mkdist/pull/152 has been merged in [email protected]~, although an issue on it has been opened last week (https://github.com/unjs/mkdist/issues/182). Let's see how that evolves, and if everything checks we'll tag the devs here :)~

ennioVisco avatar Nov 09 '23 13:11 ennioVisco

@guibulator let's keep the discussion here, I think you can close the issue on mkdist.

@danielroe would you kindly 🙏 bump the mkdist version and allow us to exclude sass from the builder like in https://github.com/wd-4000/mkdist/blob/22515607be5b47b9f065fa41a3fc8ca297b125af/src/loaders/index.ts (that has been accepted in [email protected] via https://github.com/unjs/mkdist/pull/152)?

ennioVisco avatar Nov 09 '23 13:11 ennioVisco

@ennioVisco We now have the latest mkdist version - do you need anything else, or do you think we can close this?

danielroe avatar Dec 20 '23 10:12 danielroe

@ennioVisco We now have the latest mkdist version - do you need anything else, or do you think we can close this?

Unfortunately, I think there is still a missing step: we need to be able to specify the loaders to use (or, to tell nuxt-module-builder to not pick the sass loader. Check this comment that should clarify the issue: https://github.com/unjs/mkdist/issues/182#issuecomment-1803853897

ennioVisco avatar Dec 20 '23 11:12 ennioVisco

Sorry for late response.

This is how you can customize loaders:

// build.config.ts (in root of your module project)
import { defineBuildConfig } from 'unbuild'

export default defineBuildConfig({
  hooks: {
    'mkdist:entry:options' (_ctx, _entry, opts) {
      opts.loaders = ['js', 'vue'] // Default: ['js', 'vue', 'sass', 'postcss']
    }
  }
})

I guess we can make it easier (https://github.com/unjs/unbuild/issues/361 and https://github.com/unjs/mkdist/issues/194) and also documented for nuxt module builder.

pi0 avatar Jan 21 '24 17:01 pi0

Sorry for late response.

This is how you can customize loaders:

// build.config.ts (in root of your module project)
import { defineBuildConfig } from 'unbuild'

export default defineBuildConfig({
  hooks: {
    'mkdist:entry:options' (_ctx, _entry, opts) {
      opts.loaders = ['js', 'vue'] // Default: ['js', 'vue', 'sass', 'postcss']
    }
  }
})

I guess we can make it easier (unjs/unbuild#361 and unjs/mkdist#194) and also documented for nuxt module builder.

Sweet, thanks a lot!! Unfortunately, this still requires to have a full understanding of how unbuild is used in module-builder, which is not really straightforward, but perhaps @danielroe can help on providing that option directly from module-builder's api?

ennioVisco avatar Jan 21 '24 18:01 ennioVisco

module-builder is essentially a preset for unbuild. That's what I meant we need to better document how they related and work together :)

pi0 avatar Jan 21 '24 18:01 pi0

Sorry for late response.

This is how you can customize loaders:

// build.config.ts (in root of your module project)
import { defineBuildConfig } from 'unbuild'

export default defineBuildConfig({
  hooks: {
    'mkdist:entry:options' (_ctx, _entry, opts) {
      opts.loaders = ['js', 'vue'] // Default: ['js', 'vue', 'sass', 'postcss']
    }
  }
})

I guess we can make it easier (unjs/unbuild#361 and unjs/mkdist#194) and also documented for nuxt module builder.

If someone stumbles upon this issue, I didn't get from pi0's reply that this actually can be added ON TOP of module-builder's build.config.ts, as it is actually written in the first comment of the code block. (And, it does solve the issue!)

Then, how /whenunbuild is able to work while chaining these build.config.ts files, is really magic for me and it would be very appreciated if this neat feature was documented a bit.

ennioVisco avatar Feb 18 '24 18:02 ennioVisco