Shopify
Theme Check
A linter for Shopify Themes
Theme Check helps you follow best practices by analyzing the files inside your Shopify theme.
Theme Check is available to code editors that support the Language Server Protocol.
You may be interested by the sibling modules:
@shopify/theme-check-common: (you are here) npm module to run checks on a Theme (runtime agnostic).@shopify/theme-check-node: npm module to run checks from a Node.js runtime.@shopify/theme-check-browser: npm module to run checks in a Browser.
Installation
CLI
Theme Check is integrated in the Shopify CLI.
shopify theme checkAs a library
There are three libraries:
yarn add @shopify/theme-check-node
yarn add @shopify/theme-check-common
yarn add @shopify/theme-check-browserUsage
This repo only contains the library over the functionality. The CLI is implemented in Shopify/cli.
For CLI usage documentation, refer to shopify.dev.
Node
The node version comes with batteries included. All you need is the root path of the theme.
// simple-cli.ts
import { check } from '@shopify/theme-check-node';
async function main() {
const root = process.cwd();
const offenses = await check(root);
console.log(offenses);
}
main();Browser
The browser version is a bit more complex, you need to provide your own implementation of all the dependency injections.
import { simpleCheck, recommended, ThemeData, Config, Dependencies } from '@shopify/theme-check-browser';
async function main() {
const themeDesc = {
'snippets/product-card.liquid': '{{ product | image_url | image_tag }}',
'snippets/for-loop.liquid': '{% for variant in product.variants %}...{% endfor %}',
};
const config: Config = {
checks: recommended,
settings: {},
root: '/',
};
const dependencies: Dependencies = {
// ...
};
const offenses = await simpleCheck(themeDesc, config, dependencies);
console.log(offenses);
}
main();Contributing
See CONTRIBUTING.md.