💧 WIP
Liquify is still under development. The project has been open sourced and will
release in an incremental manner. 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 provides powerful developer tooling for the Liquid Template Language.
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 (SSG) 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 within nexus. It intends to provide everything required for Shopify themes, Jekyll and 11ty static sites or custom projects leveraging Liquid as the consumer facing language. It aims to deliver powerful text editor features that enrich the programming experience and lives of those working with the template language.
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.
Liquify is a pnpm powered monorepo project. Most packages contained within this repository are available for download via the NPM Registry. Consult the readme of each package for a deeper understanding of a modules use-case and appropriation. Some packages are maintained in an isolated repositories using Git Sub-Modules. PR's and issues pertaining to submodule projects are tracked outside of this repository.
These packages are the text editor LSP clients.
These packages are considered the core modules of the project.
The
@liquify/schemapackage is published as a sub-module.
This is the Language Server module that provide text editor capabilities in vscode and other LSP supported environments.
These packages are the sharable configurations for popular development tools leveraged in the workspace.
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.
This is test runner extension package which extends upon AVA. The module helps alleviate some of the complexities involved with testing AST structures in projects like @liquify/parser, Æsthetic and more.
These packages exist in the monorepo but are distributed independent of the Liquify organization NPM registry name. These packages are published and maintained in an isolated repositories using Git Sub-Modules.
Several different projects exist within Liquify. Some projects have their own designated documentation and domain address. Documentation packages are marked as private and are served up via Netlify. Refer to below list of documentation websites shipped from this monorepo.
- liquify.dev
- æsthetic.dev
- papyrus.js.org
- syncify.js.org
Refer to readme files contained within the docs sub-directory of each project for more information.
The project and its 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. The recommended extensions are important as they ensure the best possible development experience.
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.
- 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 and exclude utils/docs etc.
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.
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.
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
pnpm @server <dev|build|test> Targets the Liquid Language Server package
pnpm @esthetic <dev|build|test> Targets the Æsthetic 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 Moloko (monaco) text editor package
pnpm @highlight <dev|build|test> Targets the CLI syntax highlight package
pnpm @ava <dev|build> Targets the AVA test extender package
pnpm @schema <build|generate> Targets the Schema Stores package
pnpm @docs:liquify <dev|build|deploy> Targets the liquify.dev documentation
pnpm @docs:esthetic <dev|build|deploy> Targets the æsthetic.dev documentation
pnpm @docs:moloko <dev|build|deploy> Targets the moloko.js.org documentation
pnpm @docs:syncify <dev|build|deploy> Targets the syncify.js.org documentation
pnpm @docs:papyrus <dev|build|deploy> Targets the papyrus.js.org documentation
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/parser and Æsthetic.
Want to contribute? Shoot me an email or reach out via Twitter.