Trio Icon
Trio v6.0.3
Documentation is evolving and is a WIP

Additional Resources

On this page are additional resources that you may find beneficial.

ESLint Support For Your JavaScript

A shareable ESLint configuration package is available for you to install and use in your Trio projects, which will install ESLint and all its dependencies. This package extends eslint-config-standard, so out of the box it comes with sensible default rules which, of course, you are able to override and extend.

To install this package in your projects, please follow the instructions below:

  • If your project doesn't already have a package.json file, create one by opening a terminal, navigating to your project's root folder, and running the following command:
    npm init -y
  • Now run the following command in your terminal to install the shareable ESLint configuration package:
    npm i --save-dev @4awpawz/eslint-config-4awpawzconfig
  • In your project's root folder create a new file and name it .eslintrc.json. Now copy the following
    {
        "extends": "@4awpawz/eslint-config-4awpawzconfig"
    }
    into this new file and save this file.

An NPM Package For Importing Uncached Modules

When your tag-based callbacks and filter functions have their own internal module dependencies, you should import those dependencies using import-fresh (or some similar package) to guarantee that you are always importing fresh, uncached copies of them and they reflect your most recent changes.

To install import-fresh in your projects, please follow the instructions below:

  • If your project doesn't already have a package.json file, create one by opening a terminal, navigating to your project's root folder, and running the following command:
    npm init -y
  • Now run the following command in your terminal to install the import-fresh package:
    npm i --save-dev import-fresh

Use import-fresh in your tag-based callbacks and your filter functions just as you would use Node's built-in global require:

const importFresh = require("import-fresh");
const someDependency = importFresh("./lib/someModule");

Visual Studio Code Snippets

Trio specific code snippets are available here, and include support for the following:

  • fragment, include and tag-based callback front-matter blocks
  • data-trio-* tag attributes

HTML Syntax Highlighting Support For ES6 Multiline Strings

You can easily add HTML syntax highlighting to your JavaScript's multi line strings by installing this Visual Studio Code es6-string-html plugin.