bigcommerce / stencil-cli

BigCommerce Stencil emulator for local theme development
https://developer.bigcommerce.com/stencil-docs
BSD 4-Clause "Original" or "Old" License
101 stars 141 forks source link

Bundle error in version 4.1.0 #926

Open spire-mike opened 2 years ago

spire-mike commented 2 years ago

I am receiving an error during the bundling process ever since 4.1.0 was released. Nothing has change in my theme files, so I am having trouble figuring out what is causing the issue. Here is the error I'm receiving on version 4.1.0.

2022-05-09T13:53:16.9329481Z Upcoming request GET: ***/admin/oauth/info
2022-05-09T13:53:17.2433511Z Upcoming request GET: https://api.bigcommerce.com/stores/6p8lmnk/v3/themes
2022-05-09T13:53:17.7015524Z Validating theme...
2022-05-09T13:53:17.8431530Z /opt/hostedtoolcache/node/12.22.12/x64/lib/node_modules/@bigcommerce/stencil-cli/lib/bundle-validator.js:488
2022-05-09T13:53:17.8432254Z         throw new Error(`Couldn't find file for this statement: ${result[0]}`.red);
2022-05-09T13:53:17.8432712Z               ^
2022-05-09T13:53:17.8432941Z 
2022-05-09T13:53:17.8433587Z Error: Couldn't find file for this statement: {{stylesheet '/assets/dist/checkout.css'}}
2022-05-09T13:53:17.8434609Z     at BundleValidator.tryToResolveCssFileLocation (/opt/hostedtoolcache/node/12.22.12/x64/lib/node_modules/@bigcommerce/stencil-cli/lib/bundle-validator.js:488:15)
2022-05-09T13:53:17.8435605Z     at BundleValidator.getCssFiles (/opt/hostedtoolcache/node/12.22.12/x64/lib/node_modules/@bigcommerce/stencil-cli/lib/bundle-validator.js:456:39)
2022-05-09T13:53:17.8436583Z     at async BundleValidator._validateCssFiles (/opt/hostedtoolcache/node/12.22.12/x64/lib/node_modules/@bigcommerce/stencil-cli/lib/bundle-validator.js:414:26)
2022-05-09T13:53:17.8561699Z ##[error]Process completed with exit code 1.

As soon as I fix my stencil version to 3.13.0 the issue goes way. I noticed some skipped tests related to BundleValidator in the 4.1.0 release. Could that have something to do with this error?

Here is a possibly relevant part of my codebase. In my templates/layout/base.html file:

{{#if page_type '==' 'checkout'}}
    <link rel="preload" href="{{cdn 'assets/dist/checkout.css'}}" as="style">
    <link rel="preload" href="{{cdn 'assets/dist/theme-bundle.checkout.js'}}" as="script">
    {{{stylesheet '/assets/dist/checkout.css'}}}
{{else if page_type '==' 'orderconfirmation'}}
    <link rel="preload" href="{{cdn 'assets/dist/checkout.css'}}" as="style">
    <link rel="preload" href="{{cdn 'assets/dist/theme-bundle.checkout.js'}}" as="script">
    {{{stylesheet '/assets/dist/checkout.css'}}}
{{endif}}

This has worked for years without issue until 4.1.0 stencil release. Any idea what's going on?

Environment

Stencil-cli version stencil --version: 4.1.0

Node version node -v: 12.22.12

NPM version npm -v:

OS: Ubunut 20.04.4 LTS

jairo-bc commented 2 years ago

Hi @spire-mike, sorry to hear that! While fix is not released yet, I can recommend you moving css files into /assets/scss folder. I think the example how css files are stored in the theme was taken from our Cornerstone theme