Skip to content
This repository has been archived by the owner on Oct 4, 2021. It is now read-only.

0.29.0: Ogone build and deploy

Latest
Latest
Compare
Choose a tag to compare
@SRNV SRNV released this 06 Apr 15:39
· 1 commit to master since this release
0.29.0
668d1d1

ogone-svg-svg (1)-svg (1)

Ogone 0.29.0

I'm glad to announce Ogone 0.29.0, this version will open the world to Ogone because it includes some interesting features and a required HMR system, please note this:

  • Build and Deploy commands with the cli
  • re-integration of the built-in HMR
  • integration of the HSE
  • Fix of the CSS pre-processor
  • and some breaking changes

Installation

deno install -Afq --unstable https://deno.land/x/ogone@0.29.0/cli/ogone.ts

Features

Time to Build

Ogone will now let you build your application with the new command ogone build
basically the usage is ogone build <path to component> <path to dist folder>

Ogone will build the application and copy all the assets into a static folder.
you can also import TS/JS modules inside your component using the following syntax:

Screenshot from 2021-04-06 17-30-15

the dist folder will follow this architecture

- dist/
      - app.js
      - index.html
      - style.css
      - static/
            - ...

CSS and JS files are minified by default.

Time to Deploy

Deno Company has recently exposed a new way to deploy Deno application, this a new opportunity for Ogone to deploy front-end applications to the world.
same usage for the deploy command:
ogone deploy <path to component> <path to dist>

Ogone will add a deploy.ts file (deploy file) which will match with the Cloud flare worker's pattern used by Deno Deploy.
After this, just provide to Deno Deploy the url to the deploy file: http://.../<path to dist>/deploy.ts

you can use the command deploy into a Github Action on each new releases, for example.

HMR is coming back to Ogone

A long refacto has been made to re-integrate the HMR system of Ogone. note that it's not hot reloading but hot module replacement.
All modifications will update your application and keep it sync with your mind.
For this built-in HMR system, only one source of code is used, running on Deno and browser

HSE (Visual Studio Code Webview)

Hot Scoped Edition, the idea is to expose the component you're working on, not all the application, just the component.
This is curently only available into VS Code. please use the latest version of Otone

Usage:

click on the new button in the activity bar, this will show the panel with the button Start HSE session.
Click on this button, it will open the webview and wait for your editions.

Screenshot from 2021-04-06 17-09-21

Breaking changes

Base URL required for assets

You will now have to specify the base url to assets like following into your root component (which is an App Component):

<proto type="app" base="./path/to/assets">
...
</proto>

this folder will copy all the files into the asset. This is required for module resolution also and asset resolution.

Style Element on top is no more supported

Ogone will no more support the pattern template - proto - style but only template - proto as top level elements.
indeed, the Style element is now strictly related to the Template element.

To style your component, like when you're styling a Web-component, the style element will have to be the first element into your Template element.
This is to follow the current pattern of the Web-components.

NB

keep expecting breaking changes.

Ressources

Deno/x: https://deno.land/x/ogone@0.29.0
Nest/x: https://nest.land/package/Ogone
Discord: https://discord.gg/gCnGzh2wMc

Assets 2
Loading