mirror of
https://github.com/a2nt/silverstripe-webpack.git
synced 2024-10-22 17:05:31 +02:00
IMPR: Add optional configuration values
This commit is contained in:
parent
2e36f2f048
commit
9684f37a98
@ -18,4 +18,6 @@ A2nt\CMSNiceties\Templates\WebpackTemplateProvider:
|
||||
injectClient: true
|
||||
GRAPHQL_URL: '/graphql'
|
||||
GRAPHQL_API_KEY: 'LgPaRkVPYa8IY7x3AjbLC8wx6oPPSlO01yPflFXecvQ'
|
||||
PROCESS_CSS: true # Deep CSS minification
|
||||
JQUERY: false # We don't use jQuery, otherwise it's aliassed and being loaded externaly
|
||||
#STATIC_URL: 'http://127.0.0.1'
|
||||
|
||||
36
package.json
36
package.json
@ -36,9 +36,9 @@
|
||||
"dependencies": {
|
||||
"@a2nt/meta-lightbox-js": "^4.1.7",
|
||||
"@a2nt/ss-bootstrap-ui-webpack-boilerplate-react": "^4.4.6",
|
||||
"@angular/common": "^13.1.2",
|
||||
"@angular/core": "^13.1.2",
|
||||
"@apollo/client": "^3.5.7",
|
||||
"@angular/common": "^13.2.0",
|
||||
"@angular/core": "^13.2.0",
|
||||
"@apollo/client": "^3.5.8",
|
||||
"@jsanahuja/instagramfeed": "github:jsanahuja/instagramfeed",
|
||||
"@popperjs/core": "^2.11.2",
|
||||
"@turf/clone": "^6.5.0",
|
||||
@ -50,7 +50,7 @@
|
||||
"@turf/meta": "^6.5.0",
|
||||
"aos": "^2.3.4",
|
||||
"apollo3-cache-persist": "^0.13.0",
|
||||
"axios": "^0.24.0",
|
||||
"axios": "^0.25.0",
|
||||
"balanced-match": "^2.0.0",
|
||||
"bootbox": "^5.5.2",
|
||||
"bootstrap": "^5.1.3",
|
||||
@ -59,7 +59,7 @@
|
||||
"density-clustering": "^1.3.0",
|
||||
"fast-deep-equal": "^3.1.3",
|
||||
"font-awesome": "^4.7.0",
|
||||
"graphql": "^16.2.0",
|
||||
"graphql": "^16.3.0",
|
||||
"hammerjs": "^2.0.8",
|
||||
"inputmask": "^5.0.7",
|
||||
"kdbush": "^3.0.0",
|
||||
@ -87,16 +87,16 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@a2nt/image-sprite-webpack-plugin": "^0.2.5",
|
||||
"@babel/core": "^7.16.7",
|
||||
"@babel/core": "^7.16.12",
|
||||
"@babel/eslint-parser": "^7.16.5",
|
||||
"@babel/plugin-proposal-class-properties": "^7.16.7",
|
||||
"@babel/plugin-proposal-object-rest-spread": "^7.16.7",
|
||||
"@babel/plugin-syntax-jsx": "^7.16.7",
|
||||
"@babel/plugin-syntax-top-level-await": "^7.14.5",
|
||||
"@babel/plugin-transform-react-jsx": "^7.16.7",
|
||||
"@babel/plugin-transform-runtime": "^7.16.8",
|
||||
"@babel/plugin-transform-runtime": "^7.16.10",
|
||||
"@babel/plugin-transform-typescript": "^7.16.8",
|
||||
"@babel/preset-env": "^7.16.8",
|
||||
"@babel/preset-env": "^7.16.11",
|
||||
"@babel/preset-react": "^7.16.7",
|
||||
"@babel/runtime": "^7.16.7",
|
||||
"@googlemaps/markerclusterer": "*",
|
||||
@ -112,12 +112,12 @@
|
||||
"autoprefixer": "^10.4.2",
|
||||
"babel-loader": "^8.2.3",
|
||||
"classnames": "^2.3.1",
|
||||
"copy-webpack-plugin": "^10.2.0",
|
||||
"copy-webpack-plugin": "^10.2.4",
|
||||
"croppie": "^2.6.5",
|
||||
"cross-env": "^7.0.3",
|
||||
"css-loader": "^6.5.1",
|
||||
"css-minimizer-webpack-plugin": "^3.3.1",
|
||||
"eslint": "^8.6.0",
|
||||
"css-minimizer-webpack-plugin": "^3.4.1",
|
||||
"eslint": "^8.8.0",
|
||||
"eslint-plugin-import": "^2.25.4",
|
||||
"eslint-plugin-jquery": "^1.5.1",
|
||||
"eslint-plugin-react": "^7.28.0",
|
||||
@ -135,14 +135,14 @@
|
||||
"html-dom-parser": "^1.0.4",
|
||||
"html-entities": "^2.3.2",
|
||||
"html-loader": "^3.1.0",
|
||||
"html-react-parser": "^1.4.5",
|
||||
"html-react-parser": "^1.4.6",
|
||||
"html-webpack-plugin": "^5.5.0",
|
||||
"img-optimize-loader": "^1.0.7",
|
||||
"js-yaml": "^4.1.0",
|
||||
"loglevel": "^1.8.0",
|
||||
"mini-css-extract-plugin": "^2.5.0",
|
||||
"msw": "^0.36.4",
|
||||
"node-fetch": "^3.1.0",
|
||||
"mini-css-extract-plugin": "^2.5.3",
|
||||
"msw": "^0.36.8",
|
||||
"node-fetch": "^3.2.0",
|
||||
"object-assign": "^4.1.1",
|
||||
"optimism": "^0.16.1",
|
||||
"optimize-css-assets-webpack-plugin": "^6.0.1",
|
||||
@ -155,7 +155,7 @@
|
||||
"react-is": "^17.0.2",
|
||||
"react-lifecycles-compat": "^3.0.4",
|
||||
"regenerator-runtime": "^0.13.9",
|
||||
"resolve-url-loader": "^4.0.0",
|
||||
"resolve-url-loader": "^5.0.0",
|
||||
"rimraf": "^3.0.2",
|
||||
"routie": "0.0.1",
|
||||
"sass": "*",
|
||||
@ -175,9 +175,9 @@
|
||||
"tslib": "^2.3.1",
|
||||
"url": "^0.11.0",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.66.0",
|
||||
"webpack": "^5.67.0",
|
||||
"webpack-bundle-analyzer": "^4.5.0",
|
||||
"webpack-cli": "^4.9.1",
|
||||
"webpack-cli": "^4.9.2",
|
||||
"webpack-dev-server": "^4.7.3",
|
||||
"webpack-manifest-plugin": "^4.1.1",
|
||||
"webpack-merge": "^5.8.0",
|
||||
|
||||
@ -153,30 +153,38 @@ const JSVARS = {
|
||||
BASE_HREF: JSON.stringify(''),
|
||||
};
|
||||
|
||||
const provides = {};
|
||||
const externals = {};
|
||||
const aliases = {};
|
||||
|
||||
if (!conf['JQUERY']) {
|
||||
provides['react'] = 'React';
|
||||
provides['react-dom'] = 'ReactDOM';
|
||||
externals['react'] = 'React';
|
||||
externals['react-dom'] = 'ReactDOM';
|
||||
} else {
|
||||
provides['$'] = 'jquery';
|
||||
provides['jQuery'] = 'jquery';
|
||||
externals['jquery'] = 'jQuery';
|
||||
|
||||
aliases['window.jQuery'] = require.resolve('jquery');
|
||||
aliases['$'] = require.resolve('jquery');
|
||||
aliases['jquery'] = require.resolve('jquery');
|
||||
aliases['jQuery'] = require.resolve('jquery');
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
PROVIDES: provides,
|
||||
JSVARS: JSVARS,
|
||||
configuration: conf,
|
||||
themes: themes,
|
||||
webpack: {
|
||||
entry: includes,
|
||||
externals: {
|
||||
// comment out jQuery if you don't use it to prevent bootstrap thinking that there's jQuery present
|
||||
//jquery: 'jQuery',
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
},
|
||||
externals: externals,
|
||||
resolve: {
|
||||
modules: modules,
|
||||
extensions: ['.tsx', '.ts', '.js'],
|
||||
alias: {
|
||||
// comment out jQuery if you don't use it to prevent bootstrap thinking that there's jQuery present
|
||||
/*'window.jQuery': require.resolve('jquery'),
|
||||
$: require.resolve('jquery'),
|
||||
jquery: require.resolve('jquery'),
|
||||
jQuery: require.resolve('jquery'),
|
||||
react: require.resolve('react'),
|
||||
'react-dom': require.resolve('react-dom'),*/
|
||||
},
|
||||
alias: aliases,
|
||||
fallback: {
|
||||
path: false,
|
||||
},
|
||||
|
||||
@ -16,7 +16,7 @@ const FaviconsWebpackPlugin = require('favicons-webpack-plugin');
|
||||
|
||||
const TerserPlugin = require('terser-webpack-plugin');
|
||||
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
|
||||
const { default: MiniCssExtractPlugin } = require('mini-css-extract-plugin');
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
|
||||
//const ImageSpritePlugin = require('@a2nt/image-sprite-webpack-plugin');
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||
@ -27,13 +27,8 @@ const COMPRESS = NODE_ENV === 'production' ? true : false;
|
||||
const IP = process.env.IP || conf.HOSTNAME;
|
||||
const PORT = process.env.PORT || conf.PORT;
|
||||
|
||||
let plugins = [
|
||||
new webpack.ProvidePlugin({
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
/*$: 'jquery',
|
||||
jQuery: 'jquery',*/
|
||||
}),
|
||||
const plugins = [
|
||||
new webpack.ProvidePlugin(common['PROVIDES']),
|
||||
new webpack.DefinePlugin(common['JSVARS']),
|
||||
new webpack.LoaderOptionsPlugin({
|
||||
minimize: COMPRESS,
|
||||
@ -46,24 +41,6 @@ let plugins = [
|
||||
}),
|
||||
];
|
||||
|
||||
if (COMPRESS) {
|
||||
plugins.push(require('autoprefixer'));
|
||||
|
||||
/*plugins.push(
|
||||
new ImageSpritePlugin({
|
||||
exclude: /exclude|original|default-|icons|sprite|svg|logo|favicon/,
|
||||
commentOrigin: false,
|
||||
compress: COMPRESS,
|
||||
extensions: ['png'],
|
||||
indent: '',
|
||||
log: true,
|
||||
//outputPath: path.join(__dirname, conf.APPDIR, conf.DIST),
|
||||
outputFilename: 'img/sprite-[hash].png',
|
||||
padding: 0,
|
||||
}),
|
||||
);*/
|
||||
}
|
||||
|
||||
const indexPath = path.join(__dirname, conf.APPDIR, conf.SRC, 'index.html');
|
||||
if (fs.existsSync(indexPath)) {
|
||||
plugins.push(
|
||||
@ -149,30 +126,8 @@ common.themes.forEach((theme) => {
|
||||
}
|
||||
});
|
||||
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer')
|
||||
.BundleAnalyzerPlugin;
|
||||
plugins.push(
|
||||
new BundleAnalyzerPlugin({
|
||||
analyzerMode: 'static',
|
||||
openAnalyzer: false,
|
||||
}),
|
||||
);
|
||||
|
||||
const cfg = merge(common.webpack, {
|
||||
mode: NODE_ENV,
|
||||
cache: {
|
||||
type: 'filesystem',
|
||||
},
|
||||
recordsPath: path.join(__dirname, conf.APPDIR, conf.DIST, 'records.json'),
|
||||
optimization: {
|
||||
//removeAvailableModules: false,
|
||||
//realContentHash: false,
|
||||
splitChunks: {
|
||||
name: 'vendor',
|
||||
minChunks: 2,
|
||||
},
|
||||
concatenateModules: true, //ModuleConcatenationPlugin
|
||||
minimizer: [
|
||||
const minimizers = [];
|
||||
minimizers.push(
|
||||
new TerserPlugin({
|
||||
terserOptions: {
|
||||
module: false,
|
||||
@ -213,7 +168,11 @@ const cfg = merge(common.webpack, {
|
||||
// Use multi-process parallel running to improve the build speed
|
||||
// Default number of concurrent runs: os.cpus().length - 1
|
||||
parallel: true,
|
||||
}),
|
||||
})
|
||||
);
|
||||
|
||||
if (conf['PROCESS_CSS']) {
|
||||
minimizers.push(
|
||||
new CssMinimizerPlugin({
|
||||
parallel: true,
|
||||
minimizerOptions: [{
|
||||
@ -239,8 +198,52 @@ const cfg = merge(common.webpack, {
|
||||
CssMinimizerPlugin.cssnanoMinify,
|
||||
//CssMinimizerPlugin.cleanCssMinify,
|
||||
],
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
if (COMPRESS) {
|
||||
plugins.push(require('autoprefixer'));
|
||||
|
||||
/*plugins.push(
|
||||
new ImageSpritePlugin({
|
||||
exclude: /exclude|original|default-|icons|sprite|svg|logo|favicon/,
|
||||
commentOrigin: false,
|
||||
compress: COMPRESS,
|
||||
extensions: ['png'],
|
||||
indent: '',
|
||||
log: true,
|
||||
//outputPath: path.join(__dirname, conf.APPDIR, conf.DIST),
|
||||
outputFilename: 'img/sprite-[hash].png',
|
||||
padding: 0,
|
||||
}),
|
||||
],
|
||||
);*/
|
||||
}
|
||||
|
||||
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer')
|
||||
.BundleAnalyzerPlugin;
|
||||
plugins.push(
|
||||
new BundleAnalyzerPlugin({
|
||||
analyzerMode: 'static',
|
||||
openAnalyzer: false,
|
||||
}),
|
||||
);
|
||||
|
||||
const cfg = merge(common.webpack, {
|
||||
mode: NODE_ENV,
|
||||
cache: {
|
||||
type: 'filesystem',
|
||||
},
|
||||
recordsPath: path.join(__dirname, conf.APPDIR, conf.DIST, 'records.json'),
|
||||
optimization: {
|
||||
//removeAvailableModules: false,
|
||||
//realContentHash: false,
|
||||
splitChunks: {
|
||||
name: 'vendor',
|
||||
minChunks: 2,
|
||||
},
|
||||
concatenateModules: true, //ModuleConcatenationPlugin
|
||||
minimizer: minimizers,
|
||||
},
|
||||
|
||||
output: {
|
||||
|
||||
@ -13,7 +13,7 @@ const {
|
||||
merge,
|
||||
} = require('webpack-merge');
|
||||
|
||||
const { default: MiniCssExtractPlugin } = require('mini-css-extract-plugin');
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||
|
||||
const IP = process.env.IP || conf.HOSTNAME;
|
||||
@ -23,12 +23,7 @@ const NODE_ENV = 'development'; //conf.NODE_ENV || process.env.NODE_ENV;
|
||||
const COMPRESS = NODE_ENV === 'production' ? true : false;
|
||||
|
||||
const plugins = [
|
||||
new webpack.ProvidePlugin({
|
||||
react: 'React',
|
||||
'react-dom': 'ReactDOM',
|
||||
/*$: 'jquery',
|
||||
jQuery: 'jquery',*/
|
||||
}),
|
||||
new webpack.ProvidePlugin(common['PROVIDES']),
|
||||
new webpack.DefinePlugin(common['JSVARS']),
|
||||
//new webpack.HotModuleReplacementPlugin(),
|
||||
new MiniCssExtractPlugin(),
|
||||
|
||||
Loading…
Reference in New Issue
Block a user