search

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

New starter templates for Vue and React #913

Open liron-navon opened 5 years ago

liron-navon commented 5 years ago

help required!

I need help to get the template in the wiki, unfortunately this has to be made by one of the official maintainers, I can't create a pull request =(.

contribution

I created two new starter templates which extend the shopify/skeleton-theme, One for React and one for Vue. None of them are SPA directed, and should work properly for creating components in the existing .liquid templates.

liron-navon/slate-vue-starter liron-navon/slate-react-starter

t-kelly commented 5 years ago

@liron-navon we're in the process of replacing the docs so the community can make PRs on it. Could you branch off of add-docasaurus make the edits there and open a PR?

t-kelly commented 5 years ago

Will give these starter themes a review!

liron-navon commented 5 years ago

@t-kelly

I added the changes here https://github.com/Shopify/slate/pull/914.

t-kelly commented 5 years ago

Related https://github.com/Shopify/slate/issues/871

robmellett commented 5 years ago

@liron-navon

Hey mate, I had a couple of issues getting the Vue dev tools to work using your theme. I've modified it slightly so that we load the Vue ESM, and that it supports loading elements in the following manner as opposed to the vueMount helper.

Register new Vue Components in vue/app.js 

Vue.component('example-component', require('./components/ExampleComponent.vue').default);

Throughout the liquid files, you should be able to render the vue templates with:

<example-component
    shopName="{{ shop.name }}"></example-component>

See the following changes in this repo. https://github.com/robmellett/slate-vue-starter

Thanks for doing all the leg work @liron-navon :)