Html

Basic Usage

Farm support compile Html out of box, and you should use Html as entry when build a web project, for example:

farm.config.ts

note

If the input is not specified, default to { index: 'index.html' }.

and in ./index.html, a <script src="./xxx"> should be used to refer to your script entry.

./index.html

and you can also use <link href="./xxx"> to refer to your global css.

Farm will transform these scripts and links to final production resources when compiling. Note that you have to use relative path when you want to refer to a local module, for example <script src="./index.tsx"></script> will refer to a local module and compile it, but <script src="/index.tsx"></script> or <script src="https://xxx.com/index.tsx"></script> would not.

tip

The script and link can refer to any module types that farm support, for example, js, jsx, ts, tsx, or other module types supported by plugins. You can use as many scripts or links as you want.

Multi Page App

If you are building a Multi Page Application, just configure multiple html input, for example:

farm.config.ts

Farm will compile these pages in parallel, and all dependencies of these pages will be shared too.

Inherit html template

Farm supports inherit html template by using html.base config, which is helpful when building a multi-page application with html shared.

farm.config.ts

Then add a base.html, placeholder {{children}} will be replaced by children's content.

./base.html

Inherit ./base.html:

./src/home.html