Quick Start

note

Farm needs Node 16.19.0 and above.

Online experience

Create a Farm Project

npm

npm create farm@latest

yarn

yarn create farm

pnpm

pnpm create farm

Then follow the prompts!

You can also directly specify the project name and the template you want to use via additional command line options:

npm 6.x

npm create farm@latest my-vue-app --template react

npm 7+

npm create farm@latest my-vue-app -- --template vue

yarn

yarn create farm my-vue-app --template react

pnpm

pnpm create farm my-vue-app --template vue

2. Start the Project

Choose the package manager you like, then the dependencies will be installed automatically. Then, start the project:

npm

cd farm-project && npm start

yarn

cd farm-project && yarn start

pnpm

cd farm-project && pnpm start

The project will start at http://localhost:9000 by default.

3. Configuring the Project

The project is configured by farm.config.ts/js/mjs file in the root directory of the project.

farm.config.ts

import { defineConfig } from "@farmfe/core";

export default defineConfig({
  // Options related to the compilation
  compilation: {
    input: {
      // can be a relative path or an absolute path
      index: "./index.html",
    },
    output: {
      path: "./build",
      publicPath: "/",
    },
    // ...
  },
  // Options related to the dev server
  server: {
    port: 9000,
    // ...
  },
  // Additional plugins
  plugins: [],
});

note

Refer to Config Reference for more details of configuring Farm.

4. Building the project

Build the Farm project as production-ready static files:

npm run build

The built product is downgraded to ES5 by default, and the product will be compressed and Tree Shake. If you want to preview the build product locally, you can execute npm run preview or npx farm preview.

Next Steps

• Why Farm?
• Features
• Config Reference
• Plugins