Git Product home page Git Product logo

quickshot's People

Contributors

ecomgraduates avatar gitter-badger avatar internalfx avatar rickydazla avatar waldyrious avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

quickshot's Issues

[Pages] Cannot overwrite?

If I download a page and modify I cannot re-upload. I get error {"handle":["has already been taken"]}. This is a significant degradation in functionality since 1.x where we could also watch pages: #28 — the major advantage of quickshot previously was that I never had to use the Shopify admin panel, now I do again..

Best practice workflow

Sorry if this seems obvious, but was hoping someone could enlighten me with the best way to work with the tool for local editing since upload and download do not respect deleted pages/products/theme files.

mkdir project
cd project
git init .
qs configure
qs theme download
qs products download
qs pages download
git add --all
git commit
git push

However, removing pages (for instance) on the shopify site removes the pages, but a qs pages download does not remove it from my local. I understand that it is not really a 'sync' per se, but perhaps there is a better way to work and edit with qs that eludes me.

I love the tool by the way, really helps me add more developer speed to editing shopify sites.

Thanks, Mike

Development workflow question

Hello,

I'm just getting into Shopify theme development and came across Quickshot so sorry for the noob questions but I just wanted to get some pointers on workflow.

My client has an active store which I was able to pull down into QS - that's all good. I set up a development store which I want to use for staging/dev to see theme changes before pushing to live.

However, when you create a new development store, it comes with only the Debut theme activated by default. When I tried to push the theme I downloaded from our live store, it pushes the files into the current active theme, not as a separate theme.

If so, how should I set up the dev store and a target in qs to use the correct theme? Should I add the theme to the dev store first from the store admin, then add the target and push into that? Or is there another way?

The live site is using the Canopy theme and the theme structure looks like this:

Canopy

  • assets
  • config
  • mystore-myshopify-com-canopy [<-- this is the active theme]
    • assets
    • config
    • layout
    • locales
    • sections
    • snippets
    • templates
  • layout
  • locales
  • sections
  • snippets
  • templates

I'm not sure why the active theme is in a subfolder of the Canopy theme. Could this cause problems with QS? Is this how it is supposed to be set up on the live store? It doesn't feel right - I would think it would be better to have the active theme outside of another theme but maybe this is the way Shopify structures it if you work on a duplicate of your theme.

In short, I want to upload my current live theme to work locally, then push the theme to a development store so I can see changes before going live.

Thanks!

Download jammed on webfont

Not sure exactly which file but it was either a .ttf or .svg or .eot webfont file that caused this error:

/usr/local/lib/node_modules/quickshot/download.js:138
                        if (data.asset.attachment) {
                                ^
TypeError: Cannot read property 'asset' of undefined
    at /usr/local/lib/node_modules/quickshot/download.js:138:33
    at Deferrals.exports.Deferrals.Deferrals._call (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:86:16)
    at /usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:98:26
    at exports.trampoline.trampoline (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:64:14)
    at Deferrals.exports.Deferrals.Deferrals._fulfill (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:96:16)
    at Object.ret [as cb] (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:29:18)
    at /usr/local/lib/node_modules/quickshot/helpers.js:122:18
    at Deferrals.exports.Deferrals.Deferrals._call (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:86:16)
    at /usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:98:26
    at exports.trampoline.trampoline (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:64:14)
    at Deferrals.exports.Deferrals.Deferrals._fulfill (/usr/local/lib/node_modules/quickshot/node_modules/iced-runtime/lib/runtime.js:96:16)

/pages up and download across stores

@hughker reported this to me Page with handle shipping-returns was not found in shop for pages/shipping-returns.html when trying to d/l pages from one store and upload to another. I know this was also not possible with tmbundle, @internalfx wondering if it could be solved somehow?

let Promise = require('bluebird')

I'm receiving this error when i try to use quickshot in windows (i just updated to qs v2.1).
Before that i was using qs v1.3 without issues.

let Promise = require('bluebird')
^^^

SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:387:25)
    at Object.Module._extensions..js (module.js:422:10)
    at Module.load (module.js:357:32)
    at Function.Module._load (module.js:314:12)
    at Function.Module.runMain (module.js:447:10)
    at startup (node.js:139:18)
    at node.js:999:3

When doing a theme upload I get a 404 not found.

I have downloaded a theme and i'm trying to push it to a different environment. Every time i do though I get the following error.

08:34:27 pm - Request Failed!: [404] Not Found

{"key":"theme/assets/ico-select.svg.liquid"}

Any clue why this could be happening?

Thank you in advance!

qs download fails

Nexus6:taylorstitch Rick$ qs theme download
? Select target [live] - 'Master' @ taylor-stitch.myshopify.com
04:05:06 pm - Downloaded 0 files.
Unhandled rejection Error: EEXIST: file already exists, mkdir '/Users/Rick/Sites/myshop
ify/themes/taylorstitch/theme/assets'

Is this still recommended?

This project looks like it is not actively developed, while Theme Kit is. Are there any advantages to quickshot, and is it recommended still?

Quickshot 3.0 Planning.

Hey Users,

After a multi-year hiatus, one of my large clients is moving back to Shopify!

This means that getting quickshot working properly (and quickly) is now on the front burner.

Couple questions for the community.

Is this project still useful? (has Shopify released a better tool for theme dev)

Any ideas for what will be version 3.0?

Pinging past contribs..
@rickydazla @waldyrious @hughker

Specificity / selection of resources

I wasn't really sure how to title this issue correctly, although it's easy to explain...

If I run e.g. qs theme download config --target=live in version 2.x I would have got only the contents of the config folder, whereas now the config argument in the command is ignored.

Node-Sass binding error

I recently updated my node environment to v8.9.1 and encountered an error when running qs theme watch. The node-sass binding was incorrect for my runtime environment.

Quickshot uses node-sass 3.13.1. That version is only supported within node environments up to version 7 https://github.com/sass/node-sass/releases/tag/v3.13.0.

To fix this I navigated to quickshots global npm module - /usr/local/lib/node_modules/quickshot and ran:

npm rebuild node-sass

That seems to have worked for me and I'm now able to run qs theme watch command.

Is that the correct method to fix the issue?

Will you provide an example on how to use options and filters?

Specifically, I'm trying to download a specific file from a specific target.

docs provide this:
qs theme download [options] [filter]

I'd think that this would work, but it doesn't
qs theme download --target dev --filter page.dealer-intl.liquid

Thanks!

More Ideas!

  • Products (with metafields... whoah!)
  • Collections
  • Link lists

Maybe all of the above (and Pages actually) should not be invoked by the regular call to up/download - since they are user-editable (ok, so are the theme files, but they are much more likely to actually be user-edited) there is more risk of error / overwrite...

[Products] Selective uploading of "things"

I forget what exactly each product folder consists but I would certainly like to upload only images (so as not to blow out inventory or anything else that staff have been working on while I have been optmizing said images.

Metafields might also be useful to overwrite or choose not to

Also inventory

Allow explicit call to target

Currently when you want to run a quickshot command with multiple targets in your quickshot.json file you run quickshot watch and have to choose from a dropdown the desired target.

screen shot 2015-05-07 at 3 39 46 pm

Ideally you can call the target explicitly from the watch command.

quickshot watch [target] / quickshot watch -t [target] / quickshot watch --target [target]

quickshot configure fails

[email protected]

➜  ~ qs configure
/usr/local/lib/node_modules/quickshot/bin/quickshot:3
let Promise = require('bluebird')
^^^

SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:374:25)
    at Object.Module._extensions..js (module.js:405:10)
    at Module.load (module.js:344:32)
    at Function.Module._load (module.js:301:12)
    at Function.Module.runMain (module.js:430:10)
    at startup (node.js:141:18)
    at node.js:1003:3

Theme Upload Clears Customizer Settings

Heads up to anyone heavily using the Shopify customizer. I've found that a full 'qs theme upload' will clear your customizer settings.

A solution is to make sure your settings_data.json is downloaded from your live site so it is up to date. Also don't include theme/config/settings_data.json in your .quickshotignore.

Sass interpolation with variables and liquid

Hello,
Just getting into quickshot and liquid. I've taken over development of a retail e-commerce site that already has a pre-made theme. In trying to set up my local development environment, I've gone through and split out the main styles.scss.liquid file into modular stylesheets, interpolated all of the liquid calls and importing all of the modules into main stylesheet to be precompiled and output before pushing.

Nevertheless, I'm getting some errors with some more complex liquid calls in the pre-made theme, especially when variables are referenced elsewhere in the stylesheets.

Here's an example of the original code in styles.scss.liquid:

 {% if settings.body_font contains 'GWF' %}
 {% capture gfont %}{{ settings.body_font | split: '|' | last }}{% endcapture %} 
 {% else %}{% assign gfont = settings.body_font %}
 {% endif %}
 $body-font-family: {{ gfont | replace: '+', ' ' | replace: "'", '' | split: ':' | first | default: 'sans-serif' }}, sans-serif;

Which I've interpolated to:

 /* {% if settings.body_font contains 'GWF' %} */
 /* {% capture gfont %} */
 /* {{ settings.body_font | split: '|' | last | prepend: '*\/' | append: '\/*' | remove: '\' }} */
 /* {% endcapture %} */
 /* {% else %} */
 /* {% assign gfont = settings.body_font %} */
 /* {% endif %} */
 $body-font-family: #{' {{ gfont | replace: "+", " " | replace: "\'", "" | split: ":" | first | default: "sans-serif" }} '}, sans-serif;

When I use that, I get this error in the compiler:

 Error: Invalid CSS after "...| remove: '\\' }": expected selector or at-rule, was "} */" on line 13 of /theme/styles/_typography.scss
 >> :\" | first | default: \"sans-serif\" }} "}, sans-serif;

I've looked over everything I can find on liquid/sass interpolation and not having any luck. As variables like $body-font-family are called elsewhere in the stylesheets, if I can't get this to compile, I get errors elsewhere.

Thanks!

Ignoring Liquid instead of just rendered assets

My ignore file contains a rendered scss file:

theme/assets/theme.scss

Quickshot seems to be ignoring the Liquid file too:

Rick$ qs theme watch
? Select target [dev] - 'master' 
09:09:56 am - watching theme...
09:10:07 am - IGNORING: theme/assets/theme.scss.liquid

Support for multiple themes / stores

@internalfx would be great to have ability for configuring multiple themes / stores using something like quickshot download --env=staging. Use cases could be:

  • Managing one theme across multiple stores (e.g. dev / staging / live)
  • Managing multiple themes in one store*

(*) This could be achieved using theme.id

[Pages] Watch

We used to be able to do qs pages watch but dunt werk no mo

Unable to update pages in target if pages already exist

I have two shopify environments, I'll call them A and B. I've transferred pages from A to B in the past. I've since added some pages to A and would like transfer all the pages to B (to get the new pages I added in A into B). However, I get the following error when I try the upload:
{"handle":["has already been taken"]}

Am I doing something wrong or is it not possible to do this? Do I have to delete all the pages from B first (that would be a bummer).

Thanks.

Error in errors?

As well as still getting undefined here I just got this (editing a scss.liquid file):

TypeError: Cannot read property 'errors' of undefined
    at Object.<anonymous> (/usr/local/lib/node_modules/quickshot/lib/requestify.js:54:23)
    at throw (native)
    at onRejected (/usr/local/lib/node_modules/quickshot/node_modules/co/index.js:81:24)
    at tryCatcher (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/util.js:16:23)
    at Promise._settlePromiseFromHandler (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/promise.js:504:31)
    at Promise._settlePromise (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/promise.js:561:18)
    at Promise._settlePromise0 (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/promise.js:606:10)
    at Promise._settlePromises (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/promise.js:681:18)
    at Async._drainQueue (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/async.js:138:16)
    at Async._drainQueues (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/async.js:148:10)
    at Immediate.Async.drainQueues [as _onImmediate] (/usr/local/lib/node_modules/quickshot/node_modules/bluebird/js/release/async.js:17:14)
    at tryOnImmediate (timers.js:543:15)
    at processImmediate [as _immediateCallback] (timers.js:523:5)

LiveReload

Would love to see LiveReload with Quickshot. I currently need to run a gulp task to generate this, which seems hacky af.

More detailed error response

Previously if you were running qs theme watch and were trying to upload something with a missing closing tag it would return something like the following:

Error in templates/cart.liquid - Liquid syntax error (line 66): Unknown tag 'endif'

However, in v2 it simply responds with: 09:47:08 am - undefined — it'd be great to have the additional information returned so we can help pinpoint what the error might be.

Error: ENAMETOOLONG: name too long, stat

thomas@workstation:theme$ quickshot theme watch
? Select target: [retail] - 'figaro' at holstee.myshopify.com
Watching Theme...
events.js:141
      throw er; // Unhandled 'error' event
            ^
Error: ENAMETOOLONG: name too long, stat '/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme/Users/thomas/Desktop/figaro/theme/theme'
    at Error (native)
thomas@workstation:theme$ 

Theme Management (Primary / unspecified)

Two points here within quickshot config:

  • it would be useful (for me, at least) to know which is the primary/live theme within the A-Z list for easy ID purposes. Otherwise I may have to login to store admin panel to check which is live when they are not named sensibly.
  • having option to leave the underlying theme.id blank and set up a particular target for "whichever theme is live" would also be cool.

Please let me know how quickshot has helped you!

I'd like to ask the quickshot community for testimonials of how qs has helped you with your worklflow.

Knowing how my software helps others is a great encouragement to keep it up to date.

Post your comments below, thank you! 😃

No compatible version found: node-sass@'>=3.0.0-pre <4.0.0'

npm ERR! Darwin 14.1.0
npm ERR! argv "/Users/thomas/.nvm/versions/io.js/v1.6.2/bin/iojs" "/Users/thomas/.nvm/versions/io.js/v1.6.2/bin/npm" "install" "quickshot" "-g"
npm ERR! node v1.6.2
npm ERR! npm  v2.7.1
npm ERR! code ETARGET

npm ERR! notarget No compatible version found: node-sass@'>=3.0.0-pre <4.0.0'
npm ERR! notarget Valid install targets:
npm ERR! notarget ["0.9.4-rc1","0.2.0","0.2.1","0.2.2","0.2.3","0.2.4","0.2.5","0.2.6","0.3.0","0.4.0","0.4.1","0.4.2","0.4.3","0.4.4","0.5.0","0.5.1","0.5.2","0.5.3","0.5.4","0.6.0","0.6.1","0.6.2","0.6.3","0.6.4","0.6.5","0.6.6","0.6.7","0.7.0-alpha","0.7.0","0.8.0","0.8.1","0.8.2","0.8.3","0.8.4","0.8.5","0.8.6","0.9.0","0.9.1","0.9.2","0.9.3","0.9.4-rc1","0.9.4","0.9.5-rc1","0.9.5","0.9.6","1.0.0","1.0.1","1.0.2-alpha","1.0.2","1.0.3","1.1.0","1.1.1","1.1.2","1.1.3","1.1.4","1.2.0","1.2.1","1.2.2","1.2.3","2.0.0-beta","2.0.0","2.0.1","3.0.0-alpha.0","3.0.0-beta.2","3.0.0-beta.3","3.0.0-beta.4","2.1.0","2.1.1","3.0.0-beta.5"]
npm ERR! notarget 
npm ERR! notarget This is most likely not a problem with npm itself.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.
npm ERR! notarget 
npm ERR! notarget It was specified as a dependency of 'quickshot'
npm ERR! notarget 
npm info preuninstall [email protected]
npm info uninstall [email protected]
npm info postuninstall [email protected]

npm ERR! Please include the following file with any support request:
npm ERR!     /Users/thomas/fixture/figaro/npm-debug.log
No compatible version found: node-sass@'>=3.0.0-pre <4.0.0'

theme upload error

when i go qs theme upload i get response like this

07:25:28 pm - Request Failed!: [404] Not Found
{"key":"theme/assets/android-chrome-36x36.png"}

on multiple stores. Nothing happens after that, no message whether the upload was successful or aborted. Btw, the asset that are "not found" actually exist.
im on windows 8.1, using quickshot v2.1.3

Timestamp Terminal Output

Add a timestamp to the terminal output messages so that you can see exactly when the last action finished. Particularly helpful for users with slower internet now in the boonies who miss their cable/fiber connections. 😔

/cc @rickydazla

@internalfx I was going to add a "feature-request" tag but I guess I don't have rights to do so, which is why I left it out of the title.

"Undefined" doesn't give enough information when using theme watch

While using theme watch saving an invalid file shows "{timestamp} - undefined".

This in itself is perfectly fine, and expected. Is it possible to have a description of the offending issue that prevents the theme upload?

When I copy the contents of the file into the Shopify editor and attempt to save the file I get an error block above the editor of where the problem is, which makes it quick to find and update the issue. It would be amazing if Quickshot could have this kind of feature too.

The future of Quickshot, a proposal.

Currently from the perspective of a theme tool Quickshot is pretty feature complete. But I have ambitions of making it even more powerful. I plan to make it more than just a theme tool...

But to do this, I think some breaking changes are necessary.

Currently QS has the ability to download pages into html files and upload them back again. This is handy, but I think it could be organized better. I also want to add support for more than just pages.

I am proposing breaking the pages functionality into its own module. I also plan on encapsulating all the theme functionality into a module as well.

What does it all mean?

Currently you run qs download and get all the theme files, and pages.

In the future to download the theme you run qs theme download.

Which will only download the theme files (assets, config, layouts, snippets and templates)

What about pages?

Separating theme functionality into a sub-command gives me lots of flexibility.

Now you could do qs pages download to get all pages.

Why is that great?

Want to add support for more? How about products!

qs products download

Hey! what about a command to copy products from one shop to another? It's pretty intuitive.

qs products clone [sourcetarget] [destinationtarget]

ok, ok so what do the new commands look like?

Run qs and you get this...

Quickshot #{VERSION}
==============================

Commands:
  quickshot configure          Creates/Updates the configuration file in current directory
  quickshot theme              Manage Shopify theme files
  quickshot pages              Manage Shopify pages

Run qs theme and you get this...

Quickshot theme #{VERSION}
==============================

Commands:
  quickshot theme download [options] [filter]   Download theme files, optionally providing a filter
  quickshot theme upload [options] [filter]     Upload theme files, optionally providing a filter
  quickshot theme watch [options]               Watch project folder and synchronize changes automatically

Options:
  --target=[targetname]                   Explicitly select target for upload/download/watch

This would only put QS at feature parity with what it is now, but it opens the door to Quickshot being the swiss army knife of theme development.

Community Thoughts?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.