无法使用 webpack 在 GitHub Actions 中构建生产环境答案

【问题标题】：Cannot build for production in GitHub Actions using webpack无法使用 webpack 在 GitHub Actions 中构建生产环境
【发布时间】：2020-04-14 07:11:40
【问题描述】：

我正在尝试使用以下操作将我的项目部署到 Firebase 托管：

on:
  push:
    branches:
      - master
  pull_request:
    branches:
      - master

jobs:
  deploy_to_firebase_hosting:

    runs-on: ubuntu-latest

    steps:
      - name: Checkout the repository
        uses: actions/checkout@master

      - name: Install Dependencies
        run: npm install

      - name: Build for production
        run: npm run build-prod

      - name: Deploy to Firebase
        uses: w9jds/firebase-action@master
        with:
          args: deploy --only hosting
        env:
          FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}

Build For Production 步骤中的操作失败。我的build-prod 脚本执行webpack -p --mode production。

这是此失败的错误消息：

> project-name@1.0.0 build-prod /home/runner/work/project-name/project-name
> webpack -p --mode production

/home/runner/work/project-name/project-name/node_modules/webpack-cli/bin/cli.js:93
                throw err;
                ^

TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
...

我一直在研究这个错误，我发现人们通过在运行构建之前删除 node_modules 来解决它。所以我运行了另一个动作，没有 npm install 部分。

它在 Build for production 上再次失败，但出现了一个不同的、非常合理的错误：

> webpack -p --mode production


webpack not installed

Install webpack to start bundling: 
  $ npm install --save-dev webpack

npm ERR! code ELIFECYCLE
npm ERR! errno 1

在 Github Actions 中构建生产包的正确方法是什么？

谢谢！

【问题讨论】：

标签： javascript node.js npm webpack github-actions

【解决方案1】：

我在尝试使用 GitHub 操作来构建和部署生产 Docker 容器时遇到了完全相同的问题。

事实证明，我这边的问题是由于 Webpack 在构建时无法访问任何环境变量（我的 Webpack 配置需要），这导致它出现与您在上面收到的相同错误的错误。

为了解决这个问题，我在构建命令中添加了以下行：

--env.NODE_ENV=production

例如，容器调用的最终构建命令是：

node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --env.NODE_ENV=production --progress --config webpack.prod.js

希望这会有所帮助！

【讨论】：