Webpack hangs when building on Google Compute Engine
Webpack hangs when building on Google Compute Engine
Not sure anyone experienced this before. npm run build, which is basically webpack --display-error-details, works fine on my local machines and also used to work on Google Compute Engine. Suddenly these days, it is really slow and hangs on the building process at the end. I am using the free tier of the Google Compute Engine. I am suspecting whether it's because of the performance of the machine...
npm run build
webpack --display-error-details
Here is my package.json and config:
...
"webpack": "^4.16.5",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.5"
,
"scripts":
"start": "webpack-dev-server",
"build": "webpack --display-error-details"
...
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
// const ExtractTextPlugin = require('extract-text-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const path = require('path');
const srcDir = 'src';
const tgtDir = 'dist';
const srcFullPath = path.join(__dirname, srcDir);
const tgtFullPath = path.join(__dirname, tgtDir);
console.log(webpack.SplitChunksPlugin);
module.exports =
mode: 'development',
entry:
polyfill: ['babel-polyfill'],
module: path.join(srcFullPath, 'index.jsx')
,
devtool: 'eval-source-map',// for production, refer to https://webpack.js.org/configuration/devtool/
devServer:
contentBase: tgtDir,
port: 8888,
host: '0.0.0.0',
historyApiFallback: true,
hot:false,
inline:false
// ,
// public: 'www.namwkim.org:8888'
,
resolve:
modules: [srcFullPath, 'node_modules'], //resolved to ./
extensions:['.js', '.jsx']
,
output:
path: tgtFullPath, // Path to where webpack will build stuffs
publicPath: '/', // This is used to generate URLs to e.g. images
filename: '[name].js' // This is used to name bundled files from entry points.
,
module:
rules: [
test:/.(js,
test: /.(js,
//
// test: /.woff(2)?(?v=[0-9].[0-9].[0-9])?$/,
// loader: 'url-loader?limit=10000&mimetype=application/font-woff'
// ,
// eot,
test: /.css$/,
use: [
MiniCssExtractPlugin.loader,
loader:'css-loader',
options:
modules: true,
localIdentName: '[local]--[hash:base64:7]'
]
]
,
plugins: [
new MiniCssExtractPlugin(
// Options similar to the same options in webpackOptions.output
// both options are optional
filename: './css/[name].css',
chunkFilename: './css/[id].css'
),
// new webpack.optimize.CommonsChunkPlugin(
// name: 'vendor',
// minChunks: function (module)
// // this assumes your vendor imports exist in the node_modules directory
// return module.context && module.context.indexOf('node_modules') !== -1;
//
// ),
//CommonChunksPlugin will now extract all the common modules from vendor and main bundles
// new webpack.optimize.CommonsChunkPlugin(
// name: 'manifest' //But since there are no more common modules between them we end up with just the runtime code included in the manifest file
// ),
// new ExtractTextPlugin('./css/[name].css'),
new HtmlWebpackPlugin(
filename: 'index.html',
template: path.join(__dirname, 'src/index.html')
),
new CopyWebpackPlugin([
from: 'src/assets',
to: 'assets',
force: true
]
),
new webpack.NoEmitOnErrorsPlugin(),
new webpack.LoaderOptionsPlugin(
debug: true
)
]
;
Image showing the status on Google Compute Engine
0
Thanks for contributing an answer to Stack Overflow!
But avoid …
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
But avoid …
To learn more, see our tips on writing great answers.
Required, but never shown
Required, but never shown
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
