node.js - Webpack“npm run build”不适用于Google Cloud，但适用于本地计算机

Question

我一直在使用Google Cloud App Engine，直到最近，一切都运转良好。

我有一个使用Webpack捆绑在一起的React Application。每当我在本地计算机上运行生产Webpack文件时，它都可以正常工作，但是只要我在Google Cloud App Engine上运行它，它就会卡在这里clean-webpack-plugin: /home/luis/projectname/dist has been removed.

以前效果很好，唯一改变的是我添加了一个自定义域，并通过ssl加密。当前有两个实例通过GAE运行该站点的先前版本（我需要对其进行更新）

我尝试创建一个新项目，并从头开始重复该过程，问题仍然存在。

编辑：


这是package.json

{
"name": "roto-hive",
"version": "0.5.0",
"engines": {
"node": "8.11.3"
},
"description": "RotoHive Web Application",
"main": "index.js",
"directories": {
"test": "test"
},
"dependencies": {
"body-parser": "^1.18.3",
"dotenv": "^6.0.0",
"express": "^4.16.3",
"fantasydata-node-client": "^1.1.0",
"firebase": "^5.0.4",
"firebase-admin": "^5.12.1",
"fs-extra": "^6.0.1",
"mini-css-extract-plugin": "^0.4.1",
"mobx": "^5.0.2",
"mobx-react": "^5.2.3",
"moment": "^2.22.2",
"optimize-css-assets-webpack-plugin": "^4.0.3",
"react": "^16.4.1",
"react-beautiful-dnd": "^7.1.3",
"react-circular-progressbar": "^0.8.0",
"react-cookie-consent": "^1.7.0",
"react-dom": "^16.4.1",
"react-firebaseui": "^3.0.4",
"react-fontawesome": "^1.6.1",
"react-image": "^1.3.1",
"react-js-pagination": "^3.0.2",
"react-recaptcha": "^2.3.8",
"react-responsive-modal": "^3.0.3",
"react-router-dom": "^4.3.1",
"react-select": "^1.2.1",
"react-spinkit": "^3.0.0",
"react-toastify": "^4.1.0",
"rimraf": "^2.6.2",
"solc": "^0.4.24",
"truffle-hdwallet-provider": "0.0.5",
"uglifyjs-webpack-plugin": "^1.2.7",
"web3": "^1.0.0-beta.35"
},
"devDependencies": {
"assert": "^1.4.1",
"babel-cli": "^6.26.0",
"babel-eslint": "^8.2.3",
"babel-loader": "^7.1.4",
"babel-minify-webpack-plugin": "^0.3.1",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-decorators": "^6.24.1",
"babel-plugin-transform-decorators-legacy": "^1.3.5",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"chai": "^4.1.2",
"clean-webpack-plugin": "^0.1.19",
"compression-webpack-plugin": "^1.1.11",
"css-loader": "^0.28.11",
"enzyme": "^3.3.0",
"eslint": "^4.19.1",
"eslint-config-standard": "^11.0.0",
"eslint-loader": "^2.0.0",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-node": "^6.0.1",
"eslint-plugin-promise": "^3.8.0",
"eslint-plugin-react": "^7.9.1",
"eslint-plugin-standard": "^3.1.0",
"file-loader": "^1.1.11",
"ganache-cli": "^6.1.3",
"html-webpack-plugin": "^3.2.0",
"jshint": "^2.9.6",
"lodash": "^4.17.10",
"mocha": "^5.2.0",
"nodemon": "^1.17.5",
"prettier-eslint": "^8.8.1",
"purecss": "^1.0.0",
"react-particles-js": "^2.2.0",
"react-test-renderer": "^16.4.1",
"style-loader": "^0.21.0",
"webpack": "^4.14.0",
"webpack-bundle-analyzer": "^2.13.1",
"webpack-cli": "^3.0.8",
"webpack-node-externals": "^1.7.2"
},
"scripts": {
"build": "webpack --config webpack.prod.js",
"start": "node ./dist/server.js",
"clean": "rm -rf dist node_modules build",
"watch": "webpack --watch --config webpack.dev.js",
"test": "mocha",
"start:dev": "npm run build && nodemon ./dist/server.js"
},
"repository": {
"type": "git",
"url": "git+https://LDLugo@bitbucket.org/LDLugo/rotohive.git"
},
"author": "",
"license": "ISC",
"homepage": "https://bitbucket.org/LDLugo/rotohive#readme"
}

这是webpack.prod.js


`

const path = require('path')
const nodeExternals = require('webpack-node-externals')
const HtmlWebPackPlugin = require('html-webpack-plugin')
const CleanWebpackPlugin = require('clean-webpack-plugin')

const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')

const modeObj = 'production'
const moduleObj = {
  rules: [
    {
      test: /\.(js|jsx)$/,
      exclude: /node_modules/,
      use: 'babel-loader'
    },
    {
      test: /\.js$/,
      exclude: /node_modules/,
      use: ['babel-loader', 'eslint-loader']
    },
    {
      test: /\.css$/,
      use: [
        { loader: 'style-loader' },
        { loader: 'css-loader' }
      ]
    },
    {
      test: /\.(png|svg|jpg|gif)$/,
      use: [
        'file-loader'
      ]
    },
    {
      test: /\.(woff|woff2|eot|ttf|otf)$/,
      use: [
        'file-loader'
      ]
    }
  ]
}

const client = {
  entry: {
    'client': './src/client/index.js'
  },
  mode: modeObj,
  target: 'web',
  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist/public')
  },
  devtool: 'source-map',
  module: moduleObj,
  plugins: [
    new HtmlWebPackPlugin({
      template: 'public/index.html',
      favicon: 'public/favicon.ico'
    }),
    new CleanWebpackPlugin(['dist']),
    new MiniCssExtractPlugin({
      filename: '[name].css',
      chunkFilename: '[id].css'
    })
  ],
  optimization: {
    minimizer: [
      new UglifyJsPlugin({
        cache: true,
        parallel: true,
        sourceMap: true
      }),
      new OptimizeCSSAssetsPlugin({})
    ]
  }
}

const server = {
  entry: {
    'server': './src/server/index.js'
  },
  mode: modeObj,
  target: 'node',
  output: {
    filename: '[name].js',
    path: path.resolve(__dirname, 'dist')
  },
  optimization: {
    splitChunks: {
      chunks: 'all'
    }
  },
  module: moduleObj,
  externals: [nodeExternals()]
}

module.exports = [client, server]

编辑：
因此，我将代码捆绑到dist文件夹中，并尝试手动部署它。 GAE吐出这个错误：npm ERR！代码ELIFECYCLE（以及其他内容，但其中一个对我来说很突出）

所有其他

Answer 1

虽然我无法解决该问题（我设法暂时解决了它，但它总是回来了）。我确实找到了解决方法。

因此，我要做的是在本地计算机上下载google sdk，然后将其连接到我的google cloud帐户（我在其中创建项目的帐户）。然后从我的本地计算机部署它。

因此，我能够使用npm run build进行构建，然后使用gcloud app deploy来部署捆绑的代码。