Use ifdef-loader with ESLint about ifdef-loader HOT 7 CLOSED

To solve this problem, ifdef-loader should optionally allow something like this:

/// #if USE_FLASH
import embedpano from 'lib/krpano_flash/swfkrpano';
/// #else
/// import embedpano from 'lib/krpano/krpano';
/// #endif

Obviously it's perfectly legit code for any linting system because all of the #else block is commented

ifdef-loader should remove all beginning-of-line triple-slashs in #elif and #else block at compile-time

from ifdef-loader.

Unfortunately this is not easy to solve. Because ifdef-loader syntax resides in a // comment, there are lot of cases where the resulting unprocessed code is not a valid code. This is this tool's biggest limitation.

When I have cases like that, I switch back to a simple if() else, letting webpack/Uglify remove the unused code. E.g.

if(USE_FLASH) {
  ...
} else {
  ...
}

Now this is a bad example because imports can't be put under if()s, but there are lot of other cases where this trick does apply.

from ifdef-loader.

For now, we could use

let embedpano
/// #if USE_FLASH
embedpano = require('lib/krpano_flash/swfkrpano')
/// #else
embedpano = require('lib/krpano/krpano')
/// #endif

(CommonJS require() is synchronous and similar to static import)

or

/// #if USE_FLASH
import embedpano1 from 'lib/krpano_flash/swfkrpano';
// #else
import embedpano2 from 'lib/krpano/krpano';
/// #endif
const embedpano = typeof embedpano1 !== "undefined" ? embedpano1 : embedpano2

But the aforementioned #else block comment should be a better way if implemented in ifdef-loader

ifdef-loader provides a reliable way to conditionally eliminate code, if we do something like

const USE_FLASH = true
// ...
const embedpano = USE_FLASH ? require('lib/krpano_flash/swfkrpano') : require('lib/krpano/krpano')

Then both 'lib/krpano_flash/swfkrpano' and 'lib/krpano/krpano' will probably be included in the final code (this depends on how far the dead code elimination of babel, webpack, uglify, terser could reach, and is not that predictable), which is likely not what we want.

from ifdef-loader.

I have the same issue. Is there any plan to fix this or suggestion for workaround?

from ifdef-loader.

I had a similar issue and after many other variants I only found the following workaround.

Not really nice code, but it works for me in the context of a clientside app with typescript, vue and webpack.

theming.vue

<script lang="ts">
let foo: any;

/// #if THEME=='special'
import special from "./themes/special/foo.vue";
// standard
/// #else
import standard from "./themes/standard /foo.vue";
/// #endif

if (typeof special != "undefined")
	foo= special;
else if (typeof standard != "undefined")
	foo= standard;

export default foo;
</script>

In my case I can go trough the eslint and typescript pipeline.

from ifdef-loader.

@tomchen wow, neat idea!

from ifdef-loader.

this is now addressed in v2.3.0 with the option ifdef-uncomment-prefix (see the README).

from ifdef-loader.