Rapidly build web components for the Web that work with HAX. HAX The Web's CLI tools empower you to rapidly..
# this allows you to then use hax command
npm install @haxtheweb/create --global
# then run this for interactive prompt
hax starthax start- fun ascii art and interactive CLI (via clack )hax webcomponent my-element --y- Make a new HAX capable, i18n wired, Design system (DDD) driven web component- if in a monorepo root, will place in correct location / inherit settings
hax site mysite --y- create a new HAXsite (HAXcms, single site)
Run hax help or hax webcomponent --help or hax site --help for up-to-date listing
Usage: hax [options] [command]
Options:
--
--v Verbose output for developers
--path <char> where to perform operation
--npm-client <char> npm client to use (must be installed) npm,
yarn, pnpm (default: "npm")
--y yes to all questions
--skip skip frills like animations
--auto yes to all questions, alias of y
--org <char> organization for package.json
--author <char> author for site / package.json
--import-site <char> URL of site to import
--node-op <char> node operation to perform
--item-id <char> node ID to operate on
--name <char> name of the project
--domain <char> published domain name
--title <char> Title
--content <char> Page content
--slug <char> Path (slug)
--published <char> Publishing status
--tags <char> Tags
--parent <char> Parent
--order <char> Order
--theme <char> Theme
--hide-in-menu <char> Hide in menu
-h, --help display help for command
Commands:
start Interactive program to pick options
site [options] [action]
webcomponent [options] [name] Create Lit based web components, with HAX
recommendations
help [command] display help for command
Run man hax to get detailed manual.
- listing stats
- launch site
- publish to surge.sh (if installed)
- launch element
# also this will invoke 1x
npx @haxtheweb/create
# this is same as above, better windows CLI support
npm init @haxtheweb
- Try Hax: https://hax.cloud
- HAXCellence https://haxtheweb.org/what-is-hax
"scripts": {
"hax": "hax"
}# script creating a new element called my-element w/ all defaults
npm run hax -- --name my-element --yTry setting a different cache path to load from npm config set cache C:\tmp\nodejs\npm-cache --global
If you wish to use PowerShell over Command Prompt, you may need to change your execution policy to allow scripts using the Set-ExecutionPolicy command with the -ExecutionPolicy and -Scope parameters. You should not need to do this if you are using Command Prompt.
# To see your current execution policy
Get-ExecutionPolicySet-ExecutionPolicy command documentation: https://learn.microsoft.com/en-us/powershell/module/microsoft.powershell.security/set-executionpolicy?view=powershell-7.4
Follow the prompts and let's HAX the Web together!
Step through answering basic install questions to build a HAX capable web component that works anywhere! Features:
- LitElement based
- DDDSuper class which adds our design system in
- Common conventions used to demonstrate and work with property binding
- Minor CSS variable inclusion for initial learning
Build a HAX site that can be published and transported anywhere. Your users might love it on the front end, now you get the simplicity of building on the CLI.
- Same HAX sites you can create via front end
- Templated files that work just like any HAX site
- End points baked in to do CLI commands for common endpoint operations like adding pages, deleting and editing.
- Ability to import via URL just like the front-end
- Theme development starting point to be able to build themes locally
- Primed to publish to gh-pages, vercel and more
- Discord Channel - https://bit.ly/hax-discord
- Unified issue queue - https://github.com/haxtheweb/issues/issues
- Using Merlin directly in any HAX spaces and type "Issue" to jump start a report!
- Try Hax: https://hax.cloud
- HAXCellence https://haxtheweb.org/what-is-hax
- Youtube channel - https://www.youtube.com/@haxtheweb
