npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

shopify-theme-sync

v0.0.6

Published

A tool to automatically sync themes from your local file system to your hosted Shopify shops.

Downloads

21

Readme

Shopify Theme Sync for node (v 0.0.6)

A command line tool to monitor and sync themes from your local file system to your hosted Shopify shops.

Install and Configuration

  1. Clone (then run npm install) or just npm install me onto your local machine or Cloud9IDE environment

  2. rename config-example.json to config.json.

  3. edit the properties of config.json to match your Shopify shops' private app credentials (you can do this by going to https://{yourshop}.myshopify.com/admin/apps/private) then point the config file's directory property to your themes' folders.

  4. Run the command npm start (or node app) and start editing your Shopify templates!

If you have any questions about these steps, or don't know how to use a command line tool like this one, feel free to open an issue here and/or ask about it on StackOverflow.

Options

Check config-example.json for examples on applying these options. The defaults are:

 {
 	"compress": {
 		// Enable this option for automatic file compression with Uglify.js
 		// Note: minification will only be applied to the uploaded file, the local file will not be modified.
 		"js": false // do not compress/minify JavaScript/JSON by default.
 	},
 	"uploadOriginal": false, // for compressed files, upload the original version also (with a .orig extension)
 	"ignoreDotFiles": true, // ignore dotfiles by default.
 	"interval": 500 // the default interval used when checking files for modification (in milliseconds)
 }

To Actually Edit Templates:

You'll first need to install the template into your Shopify store then download and extract the zip file for the template. For now, each template for your shop must be named after its template ID, e.g., 3981452 and 4870543.

If your config file's directory property is /home/websites/shopname/ you should have directory tree similar to:

/home/websites/shopname/3981452
                              ./assets
                              ./config
                              ...etc
/home/websites/shopname/4870543
                              ./assets
                              ./config
                              ...etc

TODO

  1. Add config option to automatically minify ~~JavaScript~~ (done), CSS, and/or HTML (w/liquid), and optimize asset images on the fly.
  2. Allow sub-directories within theme folders for better file organization. We can "fake" sub directories by replacing the "/" (forward slash) character with a magic string, like "DIR" (Shopify doesn't allow special characters in filenames, otherwise I'd just use a solidus /), i.e., the resource assets/css/main.css would be referenced and uploaded as assets__DIR__css__DIR__main.css
  3. Add config option to automatically download themes from a Shopify store to local disk.