import{_ as p,r as o,o as l,c as i,b as n,d as s,a as e,f as t}from"./app.bd9c95b7.js";const c={},r=t(`

配置文件

Fes.js 内置了比较通用的构建方式，如果没有个性化需求，不需要修改构建相关的配置。

配置文件解析

Fes.js 会自动解析项目根目录下的 .fes.js 文件。

最基础的配置文件是这样的：

// .fes.js
export default {};

可以通过环境变量 FES_ENV 进行环境差异化配置，当我们运行 FES_ENV=prod fes dev 时，Fes.js 会找到 .fes.js 和 .fes.prod.js(可选) 的配置文件进行 deepmerge。

配置智能提示

可以通过 defineBuildConfig 工具函数获取类型提示：

import { defineBuildConfig } from '@fesjs/fes';

export default defineBuildConfig({});

共享配置

alias

类型： object
默认值： {}
详情：
配置别名，对引用路径进行映射。
示例：

export default {
    alias: {
        main: 'src/assets/styles/main',
    },
};

然后 import('main')，实际上是 import('src/assets/styles/main')。

autoprefixer

类型： object
默认值：

{
    flexbox: 'no-2009';
}

`,18),d=n("p",null,"详情：",-1),u={href:"https://github.com/postcss/autoprefixer#options",target:"_blank",rel:"noopener noreferrer"},k=t(`

base

类型： string
默认值： ''
详情：
设置路由前缀，通常用于部署到非根目录。比如你有路由 /pageA、/pageB，然后设置了 base 为 /manage/，那么就可以通过 /manage/pageA、/manage/pageB 访问到它们。

2.1.x 已废弃

2.1.x 版本请使用 router.base 代替

define

类型： object
默认值： {}
详情：用于提供给代码中可用的变量。
示例：

export default {
    define: {
        __DEV__: 'development',
    },
};

然后你代码里写 console.log(__DEV__)，会被编译成 console.log('development')。

dynamicImport

类型： boolean
默认值： false
详情：
路由是否按需加载

inlineLimit

类型： number
默认值： 8192(8k)
详情：
配置图片文件是否走 base64 编译的阈值。默认是 8192 字节，小于它会被编译为 base64 编码，否则会生成单独的文件。

mock

类型： object || boolean
默认值： {}
详情：
配置 mock 属性。
- 当 mock 为 boolean 类型时，true 表示打开 mock，false 表示关闭 mock。
- 当 mock 为 object 类型时，默认打开 mock。也可以通过子属性 prefix 添加过滤条件，满足条件的走 mock 文件。
示例：

export default {
    mock: {
        prefix: '/api/auth',
    },
};

然后所有以 /api/users 开始的请求，就能进入 mock.js 文件处理，mock.js 示例。

mountElementId

类型： string
默认值： app
详情：
指定渲染到的 HTML 元素 id。

outputPath

类型： string
默认值： dist
详情：
指定输出路径。

提示

不允许设定为 src、public、pages 等约定目录。

plugins

类型： Array(string)
默认值： []
详情：
配置额外的 fes 插件。数组项为指向插件的路径，可以是 npm 依赖、相对路径或绝对路径。如果是相对路径，则会从项目根目录开始找。
示例：

export default {
    plugins: [
        // npm 依赖
        'fes-plugin-hello',
        // 相对路径
        './plugin',
        // 绝对路径
        \`\${__dirname}/plugin.js\`,
    ],
};

proxy

类型： object
默认值： {}
详情：
配置代理能力。
示例：

export default {
    proxy: {
        '/v2': {
            target: 'https://api.douban.com/',
            changeOrigin: true,
        },
    },
};

`,26),h=n("code",null,"/v2/movie/in_theaters_proxy",-1),v={href:"http://api.douban.com/v2/movie/in_theaters_proxy",target:"_blank",rel:"noopener noreferrer"},b=t(`

publicPath

类型： string
默认值： /
详情：
静态资源 publicPath。当打包的时候在静态文件路径前面添加 publicPath 的值，当你需要修改静态文件地址时，比如使用 CDN 部署，把 publicPath 的值设为 CDN 的值就可以。

router

类型： object
默认值： { mode: 'hash', base: '/' }
详情：
配置路由，具体请查看指南中关于路由的介绍

singular

类型： boolean
默认值： false
详情：
配置是否启用单数模式的目录。比如 src/pages 的约定在开启后为 src/page 目录，@fesjs/fes-plugins 插件也遵照此配置的约定。

targets

类型： object
默认值： {}
详情：
配置需要兼容的浏览器最低版本，会自动引入 polyfill 和做语法转换。

terserOptions

类型： object
默认值：

const defaultTerserOptions = {
    compress: {
        // turn off flags with small gains to speed up minification
        arrows: false,
        collapse_vars: false, // 0.3kb
        comparisons: false,
        computed_props: false,
        hoist_funs: false,
        hoist_props: false,
        hoist_vars: false,
        inline: false,
        loops: false,
        negate_iife: false,
        properties: false,
        reduce_funcs: false,
        reduce_vars: false,
        switches: false,
        toplevel: false,
        typeofs: false,

        // a few flags with noticeable gains/speed ratio
        // numbers based on out of the box vendor bundle
        booleans: true, // 0.7kb
        if_return: true, // 0.4kb
        sequences: true, // 0.7kb
        unused: true, // 2.3kb

        // required features to drop conditional branches
        conditionals: true,
        dead_code: true,
        evaluate: true,
    },
    mangle: {
        safari10: true,
    },
};

`,11),m=n("p",null,"详情：",-1),g={href:"https://github.com/terser/terser#minify-options",target:"_blank",rel:"noopener noreferrer"},_=t(`

title

类型： string
详情：
html 页面标题

webpack 专属配置

analyze

类型： object
默认值：

{
    analyzerMode: process.env.ANALYZE_MODE || 'server',
    analyzerPort: process.env.ANALYZE_PORT || 8888,
    openAnalyzer: process.env.ANALYZE_OPEN !== 'none',
    // generate stats file while ANALYZE_DUMP exist
    generateStatsFile: !!process.env.ANALYZE_DUMP,
    statsFilename: process.env.ANALYZE_DUMP || 'stats.json',
    logLevel: process.env.ANALYZE_LOG_LEVEL || 'info',
    defaultSizes: 'parsed' // stat  // gzip
}

详情：
构建结果分析，当配置 process.env.ANALYZE 时开启，例如执行ANALYZE=1 fes build

chainWebpack

`,8),f=n("li",null,[n("p",null,[s("类型："),n("code",null,"function")])],-1),y=n("li",null,[n("p",null,[s("默认值："),n("code",null,"null")])],-1),x=n("p",null,"详情：",-1),j={href:"https://github.com/neutrinojs/webpack-chain",target:"_blank",rel:"noopener noreferrer"},w=t(`

示例：

export default {
    chainWebpack(memo, { env, webpack }) {
        // 删除 fes 内置插件
        memo.plugins.delete('copy');
    },
};

cssLoader

`,3),A=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),E=n("li",null,[n("p",null,[s("默认值： "),n("code",null,"''")])],-1),L=n("p",null,"详情：",-1),P={href:"https://github.com/webpack-contrib/css-loader#options",target:"_blank",rel:"noopener noreferrer"},N=t(`

copy

类型： Array(string) || Array(object)
默认值： []
详情：
设置要复制到输出目录的文件、文件夹。
配置约定 from-to 规则，其中 from 是相对于 cwd 的路径，to 是相对于输出路径的路径。
示例：

export default {
    copy: {
        from: '/src/assets/images',
        to: 'assets/images',
    },
};

上面示例中，实现了将 cwd 路径中的 /src/assets/images 文件夹，在编译完成后，copy 到输出路径下的 assets/images 文件夹。

devServer

类型： object
默认值： {}
详情：
配置开发服务器。支持以下子配置项：
- port，端口号，默认 8000
- host，默认 localhost
- https，是否启用 https server，同时也会开启 HTTP/2
启用 port 和 host 也可以通过环境变量 PORT 和 HOST 临时指定。

devtool

`,7),V=n("li",null,[n("p",null,[s("类型： "),n("code",null,"string")])],-1),S=n("li",null,[n("p",null,[s("默认值： "),n("code",null,"cheap-module-source-map"),s(" in dev, "),n("code",null,"undefined"),s(" in build")])],-1),B=n("p",null,"详情：",-1),O={href:"https://webpack.js.org/configuration/devtool/#devtool",target:"_blank",rel:"noopener noreferrer"},z=t(`

exportStatic

类型： object
默认值： {}
详情：

配置 html 的输出形式，默认只输出 index.html。

如果开启 exportStatic，则会针对每个路由输出 html 文件。

比如以下路由，

/
/users
/list

不开启 exportStatic 时，输出，

- index.html

设置 exportStatic: {} 后，输出，

- index.html
- users.html
- list.html

externals

类型：object
默认值：{}
详情：
设置哪些模块可以不被打包，通过 <script> 或其他方式引入。

示例：

export default {
    externals: {
        vue: 'window.Vue',
    },
};

extraBabelPlugins

类型： array
默认值： []
详情：

配置额外的 babel 插件。

示例：

export default {
    extraBabelPlugins: [['import', { libraryName: 'ant-design-vue', libraryDirectory: 'es', style: 'css' }]],
};

extraBabelPresets

类型： array
默认值： []
详情：

配置额外的 babel 插件集。

extraPostCSSPlugins

`,23),D=n("li",null,[n("p",null,[s("类型： "),n("code",null,"array")])],-1),T=n("li",null,[n("p",null,[s("默认值： "),n("code",null,"[]")])],-1),Y=n("p",null,"详情：",-1),Z={href:"https://github.com/postcss/postcss/blob/master/docs/plugins.md",target:"_blank",rel:"noopener noreferrer"},C=n("h3",{id:"html",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#html","aria-hidden":"true"},"#"),s(" html")],-1),F=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),M=n("li",null,[n("p",null,[s("默认值： "),n("code",null,"{}")])],-1),I=n("p",null,"详情：",-1),H={href:"https://github.com/jantimon/html-webpack-plugin#options",target:"_blank",rel:"noopener noreferrer"},U=n("h3",{id:"lessloader",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#lessloader","aria-hidden":"true"},"#"),s(" lessLoader")],-1),q=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),R=n("li",null,[n("p",null,[s("默认值： "),n("code",null,"{}")])],-1),W=n("p",null,"详情：",-1),G={href:"https://github.com/webpack-contrib/less-loader",target:"_blank",rel:"noopener noreferrer"},J=t('

nodeModulesTransform

类型： object
默认值： { exclude: [] }
详情：
默认编译所有 node_modules 下的包，可以通过配置 exclude 来跳过某些包，以提高编译速度。

postcssLoader

',3),$=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),K=n("li",null,[n("p",null,[s("默认值： "),n("code",null,"{}")])],-1),Q=n("p",null,"详情：",-1),X={href:"https://github.com/postcss/postcss-loader#options",target:"_blank",rel:"noopener noreferrer"},nn=n("h3",{id:"vueloader",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#vueloader","aria-hidden":"true"},"#"),s(" vueLoader")],-1),sn=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),an=n("li",null,[n("p",null,[s("默认值："),n("code",null,"{}")])],-1),en=n("p",null,"详情：",-1),tn={href:"https://vue-loader.vuejs.org/zh/options.html",target:"_blank",rel:"noopener noreferrer"},pn=n("h2",{id:"vite-专属配置",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#vite-专属配置","aria-hidden":"true"},"#"),s(" Vite 专属配置")],-1),on=n("h3",{id:"viteoption",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#viteoption","aria-hidden":"true"},"#"),s(" viteOption")],-1),ln=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),cn=n("p",null,"详情：",-1),rn={href:"https://cn.vitejs.dev/config/",target:"_blank",rel:"noopener noreferrer"},dn=n("h3",{id:"vitevueplugin",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#vitevueplugin","aria-hidden":"true"},"#"),s(" viteVuePlugin")],-1),un=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),kn=n("p",null,"详情：",-1),hn={href:"https://github.com/vitejs/vite/tree/main/packages/plugin-vue",target:"_blank",rel:"noopener noreferrer"},vn=n("h3",{id:"vitevuejsx",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#vitevuejsx","aria-hidden":"true"},"#"),s(" viteVueJsx")],-1),bn=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),mn=n("p",null,"详情：",-1),gn={href:"https://github.com/vitejs/vite/tree/main/packages/plugin-vue-jsx",target:"_blank",rel:"noopener noreferrer"},_n=n("h3",{id:"vitelegacy",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#vitelegacy","aria-hidden":"true"},"#"),s(" viteLegacy")],-1),fn=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),yn=n("p",null,"详情：",-1),xn={href:"https://github.com/vitejs/vite/tree/main/packages/plugin-legacy",target:"_blank",rel:"noopener noreferrer"},jn=n("h3",{id:"vitehtml",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#vitehtml","aria-hidden":"true"},"#"),s(" viteHtml")],-1),wn=n("li",null,[n("p",null,[s("类型： "),n("code",null,"object")])],-1),An=n("p",null,"详情：",-1),En={href:"https://github.com/vbenjs/vite-plugin-html",target:"_blank",rel:"noopener noreferrer"},Ln=n("h2",{id:"更多配置项",tabindex:"-1"},[n("a",{class:"header-anchor",href:"#更多配置项","aria-hidden":"true"},"#"),s(" 更多配置项")],-1),Pn=n("p",null,"Fes.js 允许插件注册配置，如果你使用插件，肯定会在插件里找到更多配置项。",-1);function Nn(Vn,Sn){const a=o("ExternalLinkIcon");return l(),i("div",null,[r,n("ul",null,[n("li",null,[d,n("p",null,[n("a",u,[s("postcss autoprefixer 插件"),e(a)]),s(" 配置。")])])]),k,n("p",null,[s("然后访问 "),h,s(" 就能访问到 "),n("a",v,[s("http://api.douban.com/v2/movie/in_theaters_proxy"),e(a)]),s(" 的数据。")]),b,n("ul",null,[n("li",null,[m,n("p",null,[s("配置 "),n("a",g,[s("压缩器 terser 的配置项"),e(a)])])])]),_,n("ul",null,[f,y,n("li",null,[x,n("p",null,[s("通过 "),n("a",j,[s("webpack-chain"),e(a)]),s(" 的 API 修改 webpack 配置。")])])]),w,n("ul",null,[A,E,n("li",null,[L,n("p",null,[s("设置 "),n("a",P,[s("css-loader 配置项"),e(a)]),s("。")])])]),N,n("ul",null,[V,S,n("li",null,[B,n("p",null,[s("用户配置 sourcemap 类型。详见 "),n("a",O,[s(" webpack#devtool 配置"),e(a)]),s("。")])])]),z,n("ul",null,[D,T,n("li",null,[Y,n("p",null,[s("设置额外的 "),n("a",Z,[s("postcss 插件"),e(a)]),s("。")])])]),C,n("ul",null,[F,M,n("li",null,[I,n("p",null,[s("设置"),n("a",H,[s("html-webpack-plugin"),e(a)]),s("。")])])]),U,n("ul",null,[q,R,n("li",null,[W,n("p",null,[s("设置 "),n("a",G,[s("less-loader 配置项"),e(a)]),s("。")])])]),J,n("ul",null,[$,K,n("li",null,[Q,n("p",null,[s("设置 "),n("a",X,[s("postcss-loader 配置项"),e(a)]),s("。")])])]),nn,n("ul",null,[sn,an,n("li",null,[en,n("p",null,[s("配置 "),n("a",tn,[s("Vue Loader"),e(a)])])])]),pn,on,n("ul",null,[ln,n("li",null,[cn,n("p",null,[s("Vite 的配置，详情请看 "),n("a",rn,[s("Vite Config"),e(a)])])])]),dn,n("ul",null,[un,n("li",null,[kn,n("p",null,[s("自定义 "),n("a",hn,[s("@vitejs/plugin-vue"),e(a)]),s(" 的配置。")])])]),vn,n("ul",null,[bn,n("li",null,[mn,n("p",null,[s("自定义 "),n("a",gn,[s("@vitejs/plugin-vue-jsx"),e(a)]),s(" 的配置。")])])]),_n,n("ul",null,[fn,n("li",null,[yn,n("p",null,[s("自定义 "),n("a",xn,[s("@vitejs/plugin-legacy"),e(a)]),s(" 的配置。")])])]),jn,n("ul",null,[wn,n("li",null,[An,n("p",null,[s("自定义 "),n("a",En,[s("vite-plugin-html"),e(a)]),s(" 的配置。")])])]),Ln,Pn])}const On=p(c,[["render",Nn],["__file","index.html.vue"]]);export{On as default};

# 配置文件

# 配置文件解析

# 配置智能提示

# 共享配置

# alias

# autoprefixer

# base

# define

# dynamicImport

# inlineLimit

# mock

# mountElementId

# outputPath

# plugins

# proxy

# publicPath

# router

# singular

# targets

# terserOptions

# title

# webpack 专属配置

# analyze

# chainWebpack

# cssLoader

# copy

# devServer

# devtool

# exportStatic

# externals

# extraBabelPlugins

# extraBabelPresets

# extraPostCSSPlugins

# nodeModulesTransform

# postcssLoader