serverless + webpack 解决 node_modules 空间大的问题

Question

想做一个手机浏览器插件，双击收藏好看的图片。用 serverless 做后端，leancloud 做数据库。在部署 serverless 时发现，默认是要上传 node_modules 的，那也太夸张了吧。我随便装几个依赖，就 70M 了，这不行。于是想到了用 webpack 打包来实现，说干就干。

主要坑

target

target 需要设置为 node ，小坑

libraryTarget

开始没设置这个属性，然后打包部署之后，请求接口一直提示超时

{"errorCode":-1,"errorMessage":"Invoking task timed out after 10 seconds","requestId":"ddaa2df566de8e2540272e360b06329c","statusCode":433}

然后提交工单，也没啥用，还让我把 node_modules 全部传上去，那也太大了，不可能滴。

然后开始去 webpack 官网看配置，最后找到了他

libraryTarget: 'commonjs2'

原因：之前的打包方式没有 module.exports=__webpack_exports__ 这句，导致 serverless 那边无法调用服务，改成 commonjs2 就有了

开始

安装 webpack 依赖

"webpack": "^5.11.1",
"webpack-cli": "^4.2.0"

配置 webpack.config.js

const path = require('path');

module.exports = {
  entry: './app.js', // 单入口
  mode: "production",
  output: {
    filename: 'pro.js',
    path: path.resolve(__dirname,'dist'),
    libraryTarget: 'commonjs2', // 这是最关键的，后面讲他的坑
  },
  target: 'node' // 这是最关键的
};

增加启动脚本

"scripts": {
    "start": "node ./bin/www",
    "build": "webpack --progress",
    "deploy": "npm run build && sls deploy"
  },

打包之后，只有 1.3M， 部署之后，正常运行，完美