Remove Code blocks based on Environment Nx Angular

Published

I’m really interested in inserting or removing code blocks in my Angular App based on the environment. Specifically removing certain import declarations and related code that should not be used for Production keeping the bundle light, while getting the benefit of extra code in the dev environment. I know webpack can handle code trasformations, so I was wondering if there was any solution that can remove code blocks based on special syntax?

e.g.

// Special Import handled by Webpack
import { logger } from '@loggerzMaximus/core' in 'development'; // 1GB!!

export class AppComponent {

    ngOnInit() {

        // Should be stripped by webpack + import if env is not development
        logger.log('LoggerzMaximus works for dev!');

    }
  
}

From this answer I’ve seen that webpack 4 can automatically handle an if statement for node

if (process.env.NODE_ENV === 'development') {
    if(info instanceof LogModel)
        throw new Error("not a instance of LogModel");
}

Does anyone know a way to strip code based on the environment?

Source: Angular Questions

Published
Categorized as angular, nrwl-nx, typescript, webpack, webpack-4 Tagged , , , ,

Answers

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Still Have Questions?


Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us
faq