Shopify / slate

Slate is a toolkit for developing Shopify themes. It's designed to assist your workflow and speed up the process of developing, testing, and deploying themes.
https://shopify.github.io/slate
MIT License
1.28k stars 364 forks source link

Adding an index.js removes my theme.js entrypoint #927

Closed dan-gamble closed 5 years ago

dan-gamble commented 5 years ago

Problem

With a setup of:

- scripts
  - layouts
    - theme.js
  - templates
    - gift_card.js
    - product.js

I get:

Entrypoint layout.theme [big] = vendors@layout.theme.js vendors@layout.theme.js.map layout.theme.css.liquid layout.theme.js layout.theme.js.map
Entrypoint template.gift_card [big] = vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map vendors@layout.theme.js vendors@layout.theme.js.map template.gift_card.css.liquid template.gift_card.js template.gift_card.js.map
Entrypoint template.product [big] = vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map vendors@layout.theme.js vendors@layout.theme.js.map template.product.css.liquid template.product.js template.product.js.map
Entrypoint template.addresses = vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map template.addresses.js template.addresses.js.map
Entrypoint template.login = vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map template.login.js template.login.js.map

You can notice the 5 entry points above.

As soon i as i change it to:

- scripts
  - layouts
    - theme.js
  - templates
    - gift_card.js
    - index.js
    - product.js

I now get:

Entrypoint template.gift_card [big] = vendors@layout.theme.js vendors@layout.theme.js.map vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map template.gift_card.css.liquid template.gift_card.js template.gift_card.js.map
Entrypoint template.index [big] = vendors@layout.theme.js vendors@layout.theme.js.map layout.theme.css.liquid layout.theme.js layout.theme.js.map template.index.js template.index.js.map
Entrypoint template.product [big] = vendors@layout.theme.js vendors@layout.theme.js.map vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map template.product.css.liquid template.product.js template.product.js.map
Entrypoint template.addresses = vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map template.addresses.js template.addresses.js.map
Entrypoint template.login = vendors@template.addresses@template.gift_card@template.login@template.product.js vendors@template.addresses@template.gift_card@template.login@template.product.js.map template.login.js template.login.js.map

I get 5 entry points instead of 6, theme.js seems to disappear as an entry point and the contents of it no longer gets executed

dan-gamble commented 5 years ago

FWIW the webpack config shows the layout.theme as en entrypoint:

  entry:
   { 'layout.theme': '/Users/dangamble/Code/x/src/scripts/layout/theme.js',
     'template.gift_card': '/Users/dangamble/Code/x/src/scripts/templates/gift_card.js',
     'template.index': '/Users/dangamble/Code/x/src/scripts/templates/index.js',
     'template.product': '/Users/dangamble/Code/x/src/scripts/templates/product.js',
     'template.addresses': '/Users/dangamble/Code/x/src/scripts/templates/customers/addresses.js',
     'template.login': '/Users/dangamble/Code/x/src/scripts/templates/customers/login.js' },
  mode: 'production',
dan-gamble commented 5 years ago

Playing with this more i've added some manual entrypoints and that seems to knock out the layout.theme as an entry point, completely at a loss with this 😞

ghost commented 5 years ago

@dan-gamble Is this on beta-14. Think I am getting the same problem. Odd because it was working before, I can't see anything that I changed would affect it. The only thing I can think of is running a yarn install has unwittingly updated a package that is causing the issue.

For me it works when I am using yarn start the theme.js is running. When I use yarn deploy it doesn't.

Weirdly the theme.js does get compiled into the dist but it never runs.

t-kelly commented 5 years ago

Will try and tackle this this week.

t-kelly commented 5 years ago

Having a hard time reproducing this. Using starter-theme out-of-box, which includes both a scripts/layouts/theme.js and scripts/templates/index.js. I am getting both dist/assets/layout.theme.js and dist/assets/template.index.js on build.

dan-gamble commented 5 years ago

To be fair i think this is very much a deep rooted webpack bug over something to do with Slate. I had this rear it's head again today and if i move my code about a bit it goes from not working to working.

The issue is for me as well i can't narrow it down to a reproducible state. I can go back to a commit where it was working, find the code, remove it and it works. That's about it. I can't pin point anything in the code that breaks it. It just for some reason stops building the theme.js.

I'm going to close this as i don't think it's a Slate specific issue per-se and i've only come across this on one of my builds so far and we've got a few running on 0.14 so far.

lock[bot] commented 5 years ago

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.