BigComemrce has recently given updates about the Node-Sass Compiler. Node-Sass compiler is important in utilizing the SCSS in the store theme. BigCommerce is closing the support for node-sass from January 21, 2024. After this date, your current production site will work as it is designed. However, for any future updates, you will require to check and fix any compatibility issues related to SCSS and Node.js v18. This upgrade is mandatory to make sure that you are not running any outdated package that may expose your project to any security problems.
In this article, I will guide you to two possible ways to ensure your project is not affected when the node-sass compiler moves to a more advanced version.
1. Automated Solution for Incompatible Node-Sass
If there is any SCSS compatibility problem, BigCommerce provides an automated draft version of your storefront theme for your consideration.
- First, log in to your store control panel and navigate to the channel manager.
- If BigCommerce can provide you with an automated fix, you will see the draft version of your theme.
- The draft version of the theme is titled “Theme Name [SCSS AUTOFIXED]“.
- Then, check the functionalities of the theme in various devices and screen sizes, and make sure everything works properly.
- Finally, deploy the draft version on your live storefront whenever it satisfies you.
2. Manual Upgrade
If you want to upgrade it manually, use the latest version of the Stencil CLI which only supports Node v18. To make sure your storefront is up to date, follow the following steps:
- Using the latest Stencil CLI, run the below command to validate the theme code and show any errors in the console if occurred.
stencil bundle- You can get an option to run a script to update your files with the correct formatting for any issue.
- To see potential changes without making the changes, use the “dry run” option.
stencil scss-autofix --dry- Please run the following command to make changes and revalidate it.
stencil scss-autofixstencil bundle- After making the changes, run the command below to test it on your site locally.
stencil start- If everything is working well, finally you can push the changes to your storefront by running the command below.
stencil pushIf you still face any issues or problems, please consult with your development team or BigCommerce customer support.
Please contact us at manish@bay20.com or call us at +91-8800519180 for any support related to Bigcommerce. You can also visit the Bigcommerce development page to check the services we offer.
