Been trying to learn to code, and came up with a project to create a web app to capture images, resize, sort and save images to a google drive into sorted folders, to later be used to train an AI Image recognition model.
I've gotten to the point where I"m trying to deploy it locally to test it from my phone. But I keep getting the same errors no matter what I try.
I have repeatedly updated webpack.config.js and installed the necessary polyfill nodes but it still gives me the same fallback errors.
As the Error Log is too large, I have pasted into here.
And here is my current webpack.config.js
const path = require('path');
const webpack = require('webpack');
module.exports = {
entry: './src/main.js',
output: {
path: path.resolve(__dirname, './dist'),
publicPath: '/dist/',
filename: 'build.js'
},
resolve: {
fallback: {
"os": require.resolve("os-browserify/browser"),
"path": require.resolve("path-browserify"),
"querystring": require.resolve("querystring-es3"),
"crypto": require.resolve("crypto-browserify"),
"stream": require.resolve("stream-browserify"),
"url": require.resolve("url/"),
"zlib": require.resolve("browserify-zlib"),
"process": require.resolve("process/browser"),
"fs": false,
"child_process": false,
"net": false,
"tls": require.resolve('tls-browserify'),
"zlib": require.resolve("browserify-zlib"),
"https": require.resolve("https-browserify"),
"http2": require.resolve('http2'),
"assert": require.resolve("assert/")
}
},
module: {
rules: [
{
test: /\.css$/,
use: [
'vue-style-loader',
'css-loader'
],
},
{
test: /\.js$/,
loader: 'babel-loader',
exclude: /node_modules/
},
{
test: /\.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]?[hash]'
}
},
{
test: /\.vue$/,
loader: 'vue-loader'
}
]
},
devServer: {
historyApiFallback: true,
noInfo: true,
overlay: true
},
performance: {
hints: false
},
devtool: '#eval-source-map',
plugins: [
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('production')
}
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
warnings: false
}
}),
new webpack.LoaderOptionsPlugin({
minimize: true
})
]
};