快速开始
备注
Farm 需要 Node 16 及以上。
在线体验
1. 创建一个 Farm 项目
- npm
- yarn
- pnpm
npm create farm@latest
yarn create farm
pnpm create farm
然后按照提示操作即可!
备注
您还可以通过附加命令行选项直接指定项目名称和要使用的模板:
- npm 6.x
- npm 7+
- yarn
- pnpm
npm create farm@latest my-vue-app --template react
npm create farm@latest my-vue-app -- --template vue
yarn create farm my-vue-app --template react
pnpm create farm my-vue-app --template vue
2.启动项目
选择您喜欢的包管理器,安装依赖项,然后启动项目。
- npm
- yarn
- pnpm
cd farm-project && npm start
cd farm-project && yarn start
cd farm-project && pnpm start
默认情况下,该项目将从http://localhost:9000
启动。
3. 配置项目
该项目由项目根目录中的“farm.config.ts/js/mjs”文件进行配置。
farm.config.ts
import { defineConfig } from "@farmfe/core";
export default defineConfig({
// 编译相关配置
compilation: {
input: {
// 可以配置相对或者绝对路径
index: "./index.html",
},
output: {
path: "./build",
publicPath: "/",
},
// ...
},
// Dev Server 相关配置
server: {
port: 9000,
// ...
},
// 插件配置
plugins: [],
});
备注
Farm 配置的细节,参考 配置。
4. 构建项目
将 Farm 项目构建为生产环境可用的静态文件:
npm run build
构建后的产物默认降级到 ES5,同时会对产物进行压缩和 Tree Shake。如果希望本地预览 Build 的产物,可以执行 npm run preview
或者 npx farm preview
。