| sidebar |
|---|
| auto |
配置
以下配置项通过字母排序。
alias
-
类型：
object -
默认值：
{} -
详情：
配置别名，对引用路径进行映射。
-
示例：
export default {
alias: {
main: 'src/assets/styles/main'
}
}
然后 import('main')，实际上是 import('src/assets/styles/main')。
base
-
类型：
string -
默认值：
'' -
详情：
设置路由前缀，通常用于部署到非根目录。比如你有路由
/pageA、/pageB，然后设置了base为/manage/，那么就可以通过/manage/pageA、/manage/pageB访问到它们。
cssLoader
-
类型：
object -
默认值：
'' -
详情：
设置 css-loader 配置项。
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 文件夹。
define
-
类型：
object -
默认值：
{} -
详情：
用于提供给代码中可用的变量。
-
示例：
export default {
define: {
__DEV__: 'development'
}
}
然后你代码里写 console.log(__DEV__)，会被编译成 console.log('development')。
devServer
-
类型：
object -
默认值：
{} -
详情：
配置开发服务器。支持以下子配置项：
- port，端口号，默认
8000 - host，默认
localhost - https，是否启用 https server，同时也会开启 HTTP/2
启用 port 和 host 也可以通过环境变量
PORT和HOST临时指定。 - port，端口号，默认
devtool
-
类型：
string -
默认值：
cheap-module-source-mapin dev,undefinedin build -
详情：
用户配置 sourcemap 类型。详见 webpack#devtool 配置。
extraPostCSSPlugins
-
类型：
array -
默认值：
[] -
详情：
设置额外的 postcss 插件。
inlineLimit
-
类型：
number -
默认值：
8192(8k) -
详情：
配置图片文件是否走 base64 编译的阈值。默认是
8192字节，小于它会被编译为 base64 编码，否则会生成单独的文件。
lessLoader
-
类型：
object -
默认值：
{} -
详情：
设置 less-loader 配置项。
mock
-
类型：
object || boolean -
默认值：
{} -
详情：
配置 mock 属性。
- 当 mock 为
boolean类型时，true表示打开 mock，false表示关闭 mock。 - 当 mock 为
object类型时，默认打开 mock。也可以通过子属性prefix添加过滤条件，满足条件的走 mock 文件。
- 当 mock 为
-
示例：
export default {
mock: {
prefix: '/api/auth'
}
}
然后所有以 /api/users 开始的请求，就能进入 mock.js 文件处理。
mountElementId
-
类型：
string -
默认值：
app -
详情：
指定渲染到的 HTML 元素 id。
nodeModulesTransform
-
类型：
object -
默认值：
{ type: 'all' } -
详情：
设置 node_modules 目录下依赖文件的编译方式。子配置项包含：
-
type，编译模式类型，可选all和none。- 默认值是
all，全部编译，然后可以通过exclude忽略不需要编译的依赖库。 - 当切换为
none，默认值编译 es5-imcompatible-versions 里声明的依赖，可通过exclude配置添加额外需要编译的。
- 默认值是
-
exclude，忽略的依赖库，包名，暂不支持绝对路径。
前者速度较慢，但可规避常见的兼容性等问题，后者反之。
-
outputPath
-
类型：
string -
默认值：
dist -
详情：
指定输出路径。
::: tip
不允许设定为 src、public、pages 等约定目录。
:::
postcssLoader
-
类型：
object -
默认值：
{} -
详情：
proxy
-
类型：
object -
默认值：
{} -
详情：
配置代理能力。
-
示例：
export default {
proxy: {
'/v2': {
'target': 'https://api.douban.com/',
'changeOrigin': true,
}
}
}
然后访问 /v2/movie/in_theaters_proxy 就能访问到 http://api.douban.com/v2/movie/in_theaters_proxy 的数据。
publicpath
-
类型：
publicPath -
默认值：
/ -
详情：
配置 webpack 的 publicPath。当打包的时候，webpack 会在静态文件路径前面添加
publicPath的值，当你需要修改静态文件地址时，比如使用 CDN 部署，把publicPath的值设为 CDN 的值就可以。
singular
-
类型：
boolean -
默认值：
false -
详情：
配置是否启用单数模式的目录。 比如
src/pages的约定在开启后为src/page目录，@webank/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
}
}
-
详情：
配置 压缩器 terser 的配置项。
title
-
类型：
string -
默认值：
'' -
详情：
配置标题。