💧 WIP
Liquify is still under development. The project has been open sourced as the beta
release is planned for 2023. You can find various projects the exist as part of
Liquify already in circulation. The containing readme files are not up to date so
please grain of salt content.
→ Join the Discord and collaborate on the project
Liquify
Liquify provides powerful language tooling for the Liquid Template Language. The packages available in this project provide developers working with Liquid an integrated development experience.
Why
The Liquid template language has been around for a long time. Created by Shopify CEO Tobi Lütke it is leveraged by hundreds of different SaaS services, thousands of open source projects and tends to be the preferred choice for JAM~Stacked generated web applications. Despite Liquid being actively maintained by Shopify, their current solutions are missing a lot of key capabilities which I consider necessities.
Liquify was created to solve the issue of lack-lustered and otherwise incompatible solutions which exist in the Liquid nexus. It intends to provide everything required for Shopify themes, Jekyll and 11ty static sites or custom projects leveraging Liquid as the consumer. It aims to deliver powerful text editor features that enrich the programming experience and lives of those working with the template language.
LICENSING
Package licensing matters! MIT, PROPRIETARY or CC BY-NC-ND 4.0 licenses are imposed. Though the code is public, please be aware of the licensing of each package.
Packages
Liquify is monorepo project and most packages contained within this repository are available for download on the NPM Registry. Consult the readme of each package for a deeper understanding of a modules use-case and appropriation.
Client Packages
These packages are the text editor LSP clients.
Core Packages
These packages are considered the core modules of the project.
Isolated Packages
These packages exist in the monorepo but are distributed independent of the Liquify organization NPM registry name.
Config Packages
These packages are the sharable configurations for the development workspace.
Miscellaneous Packages
These are an assortment a different packages which were developed for specific purposes. They are made available as modules for consumption by projects that may wish to use or require them.
Documentation Package
This is where the documentation for liquify.dev exists, the playground for Prettify and other public facing content.
Testing Package
This is test runner extension pack for working with AVA. It helps alleviate some of the complexities involved with testing AST structures in projects like @liquify/liquid-parser, @liquify/prettify and more!
Contributing
The project and containing modules use pnpm for dependency and workspace management. Development is intended to be conducted within the vscode text editor. It is important that you install all the recommended extensions and also disable the unwanted extensions.
Third Parties (optional)
While not required, if you wish to recreate the environment in which this project is developed then you can install and leverage the above additional third-party tooling.
Installation
- Ensure pnpm is installed globally
npm i pnpm -g - Leverage
pnpm envif you need to align node versions - Clone this repository
git clone https://github.com/panoply/liquify.git - Run
pnpm iin the root directory
The project will be complied and all packages will build in postinstall. You can cd into any package or alternatively you can run pnpm dev from workspace root to start watch + build mode on packages that are specific to Liquify. The pnpm dev when executed from workspace root will target only specific packages relating to Liquify (excluding utils/docs etc).
Developing
All packages are compiled with ESBuild via tsup. In packages which require an additional build step you'll be able to find any additional logic in a containing scripts directory. When developing on the Language Server and Language Client you can run pnpm dev which will invoke watch and build instances for those core packages and then from here start up the extension host within vscode.
Per Package
pnpm dev Watch and build modes
pnpm build Build mode only (production)
pnpm test <case|file> Run tests, the project uses AVA
If you cannot be bothered to
cdinto each package then you can target packages from root directory of the workspace or alternatively just runpnpm devand all core packages will run in watch mode.
Recursive (Workspace Root)
pnpm dev Watch and build all projects relating to editor capabilities
pnpm build Build production/development bundles (this is a production build)
pnpm test Tests all packages in the repository
Targeting (Workspace Root)
pnpm lsp <dev|build|test> Targets the Liquid Language Server package
pnpm prettify <dev|build|test> Targets the Prettify package
pnpm parser <dev|build|test> Targets the Liquid Language Parser package
pnpm specs <dev|build|test> Targets the Liquid Language Specs package
pnpm vscode <dev|build> Targets the vscode client package
pnpm moloko <dev|build> Targets the Ace based Liquid browser editor
pnpm schema <build|generate> Targets the Schema Stores package
Testing
Package testing is somewhat incomplete. The Liquify project uses AVA for tests and also for printing stdout responses to the CLI in modules like the @liquify/liquid-parser and @liquify/prettify.
Contributors
Want to contribute? Shoot me an email.
Acknowledgements
Liquify took a considerable amount of time to build and has been colossal undertaking. Many sleepless nights and a lot of hours were poured into this project as not many were willing to take on this task. Thanks to all those who used the previous version of this extension.
