BigCommerce Stencil - TypeError: window.stencilBootstrap is not a function

0
votes

Since around 10:30am EST today, I have been unable to apply stencil custom themes successfully. Any theme bundled before 10:30am EST today works fine when applied to a storefront. The themes work fine locally, and there are no errors when bundling, but once the theme is applied, the page loads HTML without images or any styling applied. The error in the console reads "TypeError: window.stencilBootstrap is not a function".

I have verified the issue on multiple accounts, and even occurs when trying to bundle and apply a fresh Cornerstone clone.

There are no reported issues on status.bigcommerce.com

Is anyone else having similar issues today? Do I need to update my CLI?

Thanks

2
bigcommerce
This is an issue on our end but only with a small subset. We are working on resolving. - Alyss
Great. Thanks!! - thannes
Should be fixed now. - Alyss
Looks good. Thanks for the quick help. - thannes
@Alyss I've begun getting this issue as well. Has the issue started up again? - Bonk

2 Answers

0
votes

At the time of giving command stencil bundle, it will clear 'assets/dist' files. So that throws error theme-bundle.main.js file missing and window-stencilBootstrap is not a function.To avoid Clearing 'assets/dist' follow below steps.

Comment this below line in webpack.conf.js which is in root folder

/new CleanWebpackPlugin(['assets/dist'], {

verbose: false,

watch: false,

}),/

After this, run stencil bundle 'asset/dist' folder will not clear by doing so. Check u have 'assets/dist' folder then upload. After uploading your theme, front end will works fine.

0
votes

This is a bug at stencil-cli.

There is an open issue for it: https://github.com/bigcommerce/stencil-cli/issues/379

I have just submitted a pull request with a possible fix: https://github.com/bigcommerce/stencil-cli/pull/409

In the issue, I suggest a workaround which can be done in the theme, without having to modify stencil-cli.

At stencil.conf.js, remove these two lines from the top of the file:

var webpack = require('webpack');
var webpackConfig = require('./webpack.conf.js');

Copy them as the initial lines of development and production functions, where these variables are actually used.

This change usually fixes the issue.