Splits webpack config into three separete files. Changes build script for production and development.
This commit is contained in:
mateuswetah
parent
e70e972a95
commit
8df8f2fe59
23
build.sh
23
build.sh
|
|
@ -12,12 +12,12 @@ current_OS=`uname`
|
|||
|
||||
# For macOS (Darwin)
|
||||
if [ $current_OS == "Darwin" ]; then
|
||||
find src ./webpack.config.js -type f \( -name "*.js" -or -name "*.vue" -or -name "webpack.config.js" \) -exec md5 {} \; | sort -k 2 | md5 > last-js-build.md5
|
||||
find src *.js -type f \( -name "*.js" -or -name "*.vue" -or -name "webpack.common.js" -or -name "webpack.dev.js" -or -name "webpack.prod.js" \) -exec md5 {} \; | sort -k 2 | md5 > last-js-build.md5
|
||||
find ./src/views/admin/scss/ ./src/views/gutenberg-blocks/ ./src/views/gutenberg-blocks/tainacan-collections/collections-list ./src/views/gutenberg-blocks/tainacan-facets/facets-list ./src/views/gutenberg-blocks/tainacan-items/dynamic-items-list ./src/views/gutenberg-blocks/tainacan-items/items-list ./src/views/gutenberg-blocks/tainacan-terms/terms-list -type f \( -name "*.scss" \) -exec md5 {} \; | sort -k 2 | md5 > last-sass-build.md5
|
||||
find ./composer.json -type f \( -name "composer.json" \) -exec md5 {} \; | sort -k 2 | md5 > last-composer-build.md5
|
||||
find ./package.json -type f \( -name "package.json" -or -name "package-lock.json" \) -exec md5 {} \; | sort -k 2 | md5 > last-package-build.md5
|
||||
else
|
||||
find src ./webpack.config.js -type f \( -name "*.js" -or -name "*.vue" -or -name "webpack.config.js" \) -exec md5sum {} \; | sort -k 2 | md5sum > last-js-build.md5
|
||||
find src *.js -type f \( -name "*.js" -or -name "*.vue" -or -name "webpack.common.js" -or -name "webpack.dev.js" -or -name "webpack.prod.js" \) -exec md5sum {} \; | sort -k 2 | md5sum > last-js-build.md5
|
||||
find ./src/views/admin/scss/ ./src/views/gutenberg-blocks ./src/views/gutenberg-blocks/tainacan-collections/collections-list ./src/views/gutenberg-blocks/tainacan-facets/facets-list ./src/views/gutenberg-blocks/tainacan-items/dynamic-items-list ./src/views/gutenberg-blocks/tainacan-items/items-list ./src/views/gutenberg-blocks/tainacan-terms/terms-list -type f \( -name "*.scss" \) -exec md5sum {} \; | sort -k 2 | md5sum > last-sass-build.md5
|
||||
find ./composer.json -type f \( -name "composer.json" \) -exec md5sum {} \; | sort -k 2 | md5sum > last-composer-build.md5
|
||||
find ./package.json -type f \( -name "package.json" -or -name "package-lock.json" \) -exec md5sum {} \; | sort -k 2 | md5sum > last-package-build.md5
|
||||
|
|
@ -45,9 +45,26 @@ then
|
|||
fi
|
||||
|
||||
new_md5_js=$(<last-js-build.md5)
|
||||
|
||||
if [ "$current_md5_js" != "$new_md5_js" ]
|
||||
then
|
||||
npm run build
|
||||
is_prod_build=false
|
||||
for i in "$@"
|
||||
do
|
||||
case $i in
|
||||
--prod)
|
||||
is_prod_build=true
|
||||
echo "Building in production mode..."
|
||||
npm run build-prod
|
||||
;;
|
||||
esac
|
||||
done
|
||||
|
||||
if [ "$is_prod_build" == false ]
|
||||
then
|
||||
echo "Building in development mode..."
|
||||
npm run build
|
||||
fi
|
||||
fi
|
||||
### END npm build ###
|
||||
|
||||
|
|
|
|||
|
|
@ -11785,6 +11785,16 @@
|
|||
"uuid": "^3.3.2"
|
||||
}
|
||||
},
|
||||
"webpack-merge": {
|
||||
"version": "5.4.0",
|
||||
"resolved": "https://registry.npmjs.org/webpack-merge/-/webpack-merge-5.4.0.tgz",
|
||||
"integrity": "sha512-/scBgu8LVPlHDgqH95Aw1xS+L+PHrpHKOwYVGFaNOQl4Q4wwwWDarwB1WdZAbLQ24SKhY3Awe7VZGYAdp+N+gQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"clone-deep": "^4.0.1",
|
||||
"wildcard": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"webpack-sources": {
|
||||
"version": "1.4.3",
|
||||
"resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz",
|
||||
|
|
@ -11839,6 +11849,12 @@
|
|||
"string-width": "^1.0.2 || 2"
|
||||
}
|
||||
},
|
||||
"wildcard": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/wildcard/-/wildcard-2.0.0.tgz",
|
||||
"integrity": "sha512-JcKqAHLPxcdb9KM49dufGXn2x3ssnfjbcaQdLlfZsL9rH9wgDQjUtDxbo8NE0F6SFvydeu1VhZe7hZuHsB2/pw==",
|
||||
"dev": true
|
||||
},
|
||||
"wordwrap": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-1.0.0.tgz",
|
||||
|
|
|
|||
|
|
@ -4,7 +4,8 @@
|
|||
"author": "Eduardo <eduardo.humberto1992@gmail.com>",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "cross-env NODE_ENV=development webpack --display-error-details --mode development --progress --hide-modules"
|
||||
"build": "cross-env NODE_ENV=development webpack --config webpack.dev.js --display-error-details --progress --hide-modules",
|
||||
"build-prod": "cross-env NODE_ENV=production webpack --config webpack.prod.js --display-error-details --progress --hide-modules"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.19.2",
|
||||
|
|
@ -50,6 +51,7 @@
|
|||
"webpack": "^4.43.0",
|
||||
"webpack-bundle-analyzer": "^3.7.0",
|
||||
"webpack-cli": "^3.3.11",
|
||||
"webpack-dev-server": "^3.11.0"
|
||||
"webpack-dev-server": "^3.11.0",
|
||||
"webpack-merge": "^5.4.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,4 @@
|
|||
let path = require('path');
|
||||
let webpack = require('webpack');
|
||||
const VueLoaderPlugin = require('vue-loader/lib/plugin');
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
|
|
@ -96,7 +93,6 @@ module.exports = {
|
|||
},
|
||||
],
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
node: {
|
||||
|
|
@ -106,89 +102,5 @@ module.exports = {
|
|||
},
|
||||
performance: {
|
||||
hints: false
|
||||
},
|
||||
}
|
||||
};
|
||||
|
||||
// Change to true for production mode
|
||||
const production = false;
|
||||
|
||||
if (production === true) {
|
||||
process.env.NODE_ENV = 'production';
|
||||
const TerserPlugin = require('terser-webpack-plugin');
|
||||
|
||||
console.log(`Production: ${production}`);
|
||||
|
||||
module.exports.mode = 'production';
|
||||
|
||||
module.exports.devtool = undefined;
|
||||
|
||||
module.exports.plugins = (module.exports.plugins || []).concat([
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
NODE_ENV: JSON.stringify('production')
|
||||
}
|
||||
}),
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
minimize: true
|
||||
}),
|
||||
new VueLoaderPlugin(),
|
||||
]);
|
||||
|
||||
module.exports.resolve = {
|
||||
alias: {
|
||||
'vue$': 'vue/dist/vue.min',
|
||||
'Swiper$': 'swiper/js/swiper.min.js'
|
||||
}
|
||||
}
|
||||
|
||||
module.exports.optimization = {
|
||||
sideEffects: true,
|
||||
minimize: true,
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
parallel: true,
|
||||
sourceMap: false,
|
||||
cache: true,
|
||||
terserOptions: {
|
||||
// We preserve function names that start with capital letters as
|
||||
// they're _likely_ component names, and these are useful to have
|
||||
// in tracebacks and error messages.
|
||||
keep_fnames: /__|_x|_n|_nx/,
|
||||
mangle: {
|
||||
keep_fnames: /__|_x|_n|_nx/,
|
||||
},
|
||||
output: {
|
||||
comments: /translators:/i,
|
||||
},
|
||||
},
|
||||
extractComments: false,
|
||||
})
|
||||
],
|
||||
};
|
||||
|
||||
} else {
|
||||
console.log(`Production: ${production}`);
|
||||
|
||||
module.exports.devtool = '';
|
||||
|
||||
module.exports.plugins = [
|
||||
new webpack.DefinePlugin({
|
||||
'process.env': {
|
||||
NODE_ENV: JSON.stringify('development')
|
||||
},
|
||||
}),
|
||||
new VueLoaderPlugin(),
|
||||
new BundleAnalyzerPlugin({
|
||||
openAnalyzer: false,
|
||||
analyzerMode: 'static'
|
||||
})
|
||||
];
|
||||
|
||||
module.exports.resolve = {
|
||||
alias: {
|
||||
//'vue$': 'vue/dist/vue.esm' // uncomment this and comment the above to use vue dev tools (can cause type error)
|
||||
'vue$': 'vue/dist/vue.min',
|
||||
'Swiper$': 'swiper/js/swiper.min.js'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
const { merge } = require('webpack-merge');
|
||||
const common = require('./webpack.common.js');
|
||||
const VueLoaderPlugin = require('vue-loader/lib/plugin');
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: 'development',
|
||||
devtool: 'inline-source-map',
|
||||
plugins: [
|
||||
new VueLoaderPlugin(),
|
||||
new BundleAnalyzerPlugin({
|
||||
openAnalyzer: false,
|
||||
analyzerMode: 'static'
|
||||
})
|
||||
],
|
||||
resolve: {
|
||||
alias: {
|
||||
//'vue$': 'vue/dist/vue.esm' // uncomment this and comment the above to use vue dev tools (can cause type error)
|
||||
'vue$': 'vue/dist/vue.min',
|
||||
'Swiper$': 'swiper/js/swiper.min.js'
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,43 @@
|
|||
const { merge } = require('webpack-merge');
|
||||
const common = require('./webpack.common.js');
|
||||
const VueLoaderPlugin = require('vue-loader/lib/plugin');
|
||||
const TerserPlugin = require('terser-webpack-plugin');
|
||||
|
||||
module.exports = merge(common, {
|
||||
mode: 'production',
|
||||
devtool: undefined,
|
||||
plugins: [
|
||||
// new webpack.LoaderOptionsPlugin({
|
||||
// minimize: true
|
||||
// }),
|
||||
new VueLoaderPlugin(),
|
||||
],
|
||||
optimization: {
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
parallel: true,
|
||||
sourceMap: false,
|
||||
cache: true,
|
||||
terserOptions: {
|
||||
// We preserve function names that start with capital letters as
|
||||
// they're _likely_ component names, and these are useful to have
|
||||
// in tracebacks and error messages.
|
||||
keep_fnames: /__|_x|_n|_nx/,
|
||||
mangle: {
|
||||
keep_fnames: /__|_x|_n|_nx/,
|
||||
},
|
||||
output: {
|
||||
comments: /translators:/i,
|
||||
},
|
||||
},
|
||||
extractComments: false,
|
||||
}),
|
||||
]
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
'vue$': 'vue/dist/vue.min',
|
||||
'Swiper$': 'swiper/js/swiper.min.js'
|
||||
}
|
||||
}
|
||||
});
|
||||
Loading…
Reference in New Issue