riotjs development template using vite
Go to file
Geoff Doty 74ba9d1c26 added mounting strategy to readme 2022-07-18 00:19:13 -04:00
pages test place-holder 2022-07-17 23:51:24 -04:00
public show a mounting strategy 2022-07-17 23:50:39 -04:00
.gitignore initial commit 2022-07-06 22:32:19 -04:00
LICENSE initial commit 2022-07-06 22:32:19 -04:00
README.md added mounting strategy to readme 2022-07-18 00:19:13 -04:00
index.html show a mounting strategy 2022-07-17 23:50:39 -04:00
index.js show a mounting strategy 2022-07-17 23:50:39 -04:00
package-lock.json package tweaks 2022-07-17 23:52:30 -04:00
package.json package tweaks 2022-07-17 23:52:30 -04:00
vite.config.js initial commit 2022-07-06 22:32:19 -04:00

README.md

Vite RiotJS Template

Use Vite Starter Template to scaffold a new Riot project.

Getting Started

Pull the template files with degit and install dependencies

npx degit n2geoff/vite-riot-template my-project

cd my-project
npm install
npm run dev

Mounting Strategy

This template uses a pages static registry based approach that auto-mounts global page components that then can dynaimicly mount other components needed build your up your content via the components export default property.

SEE: /pages/registry.js for more information

Components Example

<my-page>
    <div>
        <example-component></example-component>
    </div>

    <script>
        import Example from './example-component/example-component.riot';

        export default {
            components: {
                Example
            }
        }
    </script>
</my-page>

recommend a dedicated /components directory

Testing

  • TODO

SEE: pages/hello-riot/hello-riot.spec.js (unwired)

NPM Scripts

  • npm run dev - Starts the development server at port 3000
  • npm run build - Builds the application in a dist folder
  • npm run preview - Serves the build files (dist folder) locally at port 5000

Note that if after this last command you do not see anything, you can use instead this other command:

npm run preview --host - You should then be able to see your files locally at port 5000

Checklist

When you use this template, you should update the following with your information

  • Change the author name in LICENSE
  • Change the favicon in public
  • Clean up the README

TODO

  • Add Testing Example w/ Chai & Mocha

License