前端好难啊

Posted by API Caller on October 4, 2019

各种环境, 烦人.

webpack

传入变量

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        'NODE_ENV': JSON.stringify({
          "CF_API_KEY": process.env.CF_API_KEY,
          "CF_EMAIL": process.env.CF_EMAIL,
          "CF_ACCOUNT_ID": process.env.CF_ACCOUNT_ID,
          "CF_NAME": process.env.CF_NAME,
          "CF_ROUTE": process.env.CF_ROUTE,
          "CF_TYPE": process.env.CF_TYPE,
          "CF_PRIVATE": process.env.CF_PRIVATE,
        }),
      },
    }),
    // ...
  ],
1
2
3
export function getEnv(name: string): string {
    return JSON.parse(JSON.stringify(process.env.NODE_ENV))[name]
}

编译时输出

1
2
3
4
5
6
7
8
9
10
11
12
13
module.exports = {
  plugins: [
    {
      apply(compiler) {
        compiler.hooks.beforeRun.tapAsync('MyCustomBeforeRunPlugin', function (compiler, callback) {
          // debugger
          console.log("~")
          callback()
        })
      },
    },
    // ...
  ],

压缩 ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const TerserPlugin = require('terser-webpack-plugin');

module.exports = {
  optimization: {
    minimizer: [
      new TerserPlugin({
        parallel: true,
        terserOptions: {
          ecma: 6,
        },
      }),
    ],
  },
    // ...

Patch

场景

一个包的 package.json 有问题需要修改, 不想 fork, 不想把源码带上, 于是可以 patch.

Usage

1
2
3
4
5
6
7
8
9
10
npm i patch-package --save-dev

# 然后去修改 node_modules 中需要修改的包

# 生成 patch
npx patch-package <package name>


# 然后在 package.json 中加上 "postinstall":"patch-package"

javascript heap out of memory

1
2
npm install -g increase-memory-limit
increase-memory-limit