PhilDL/OWL2-JavaScript-Project-Starter

OWL 2 Javascript Project Starter

This repo is an example on how to start a real project with the Odoo OWL framework in version 2.

Features

• OWL v2.0.5
• Javascript
• Vite
• TailwindCSS

Installation

This repo is a "template repository". It means you can quickly create repositories based on this one, without it being a fork.

Otherwise, you may clone it:

git clone https://github.com/Coding-Dodo/OWL2-JavaScript-Project-Starter.git

Install dependencies:

pnpm i

Dev with HMR:

pnpm dev

Production build

pnpm build

Preview Production build

pnpm preview

Run tests

pnpm test

Components

It is expected to create components in one file, following this convention:

import { Component, useState, tags } from "@odoo/owl";

const APP_TEMPLATE = tags.xml/*xml*/ `
<div t-name="App" class="" t-on-click="update">
  Hello <t t-esc="state.text"/>
</div>
`;

export class App extends Component {
  static template = APP_TEMPLATE;
  state = useState({ text: "Owl" });
  update() {
    this.state.text = this.state.text === "Owl" ? "World" : "Owl";
  }
}

See also

If your are searching for OWL version 1 project starter with Tailwind and PostCSS:

https://github.com/Coding-Dodo/OWL-JavaScript-Tailwind-Project-Starter