diff --git a/examples/getstarted/package.json b/examples/getstarted/package.json index 47972ac9ec..f0d756c2ed 100644 --- a/examples/getstarted/package.json +++ b/examples/getstarted/package.json @@ -1,7 +1,11 @@ { "name": "getstarted", "private": true, +<<<<<<< HEAD "version": "4.1.7", +======= + "version": "4.1.4", +>>>>>>> Add option to mesure webpack speed "description": "A Strapi application.", "scripts": { "develop": "strapi develop", diff --git a/packages/core/admin/package.json b/packages/core/admin/package.json index abfdeee8c9..823c18741b 100644 --- a/packages/core/admin/package.json +++ b/packages/core/admin/package.json @@ -27,7 +27,8 @@ "develop": "yarn create:plugin-file && yarn develop:webpack", "develop:webpack": "cross-env NODE_ENV=development webpack serve --config webpack.config.dev.js --progress profile", "prepublishOnly": "yarn build", - "builde": "rimraf build && node ./scripts/build.js", + "build": "rimraf build && node ./scripts/build.js", + "mesure:webpack-build": "rimraf build && cross-env MESURE_BUILD_SPEED=true node ./scripts/build.js", "test": "echo \"no tests yet\"", "test:unit": "jest --verbose", "test:front": "cross-env IS_EE=true jest --config ./jest.config.front.js", diff --git a/packages/core/admin/scripts/build.js b/packages/core/admin/scripts/build.js index 16170fbe33..e135d77e0d 100644 --- a/packages/core/admin/scripts/build.js +++ b/packages/core/admin/scripts/build.js @@ -3,7 +3,11 @@ const path = require('path'); const webpack = require('webpack'); const { isObject } = require('lodash'); +// eslint-disable-next-line node/no-extraneous-require +const SpeedMeasurePlugin = require('speed-measure-webpack-plugin'); + const webpackConfig = require('../webpack.config'); +const getPluginsPath = require('../utils/get-plugins-path'); const { getCorePluginsPath, getPluginToInstallPath, @@ -12,20 +16,24 @@ const { const PLUGINS_TO_INSTALL = ['i18n', 'users-permissions']; +// Wrapper that outputs the webpack speed +const smp = new SpeedMeasurePlugin(); + const buildAdmin = async () => { const entry = path.join(__dirname, '..', 'admin', 'src'); const dest = path.join(__dirname, '..', 'build'); const corePlugins = getCorePluginsPath(); const plugins = getPluginToInstallPath(PLUGINS_TO_INSTALL); const allPlugins = { ...corePlugins, ...plugins }; + const pluginsPath = getPluginsPath(); await createPluginsFile(allPlugins); const args = { entry, dest, - cacheDir: __dirname, - pluginsPath: [path.resolve(__dirname, '../../../../packages')], + cacheDir: path.join(__dirname, '..'), + pluginsPath, env: 'production', optimize: true, options: { @@ -34,7 +42,10 @@ const buildAdmin = async () => { }, }; - const compiler = webpack(webpackConfig(args)); + const config = + process.env.MESURE_BUILD_SPEED === 'true' ? smp.wrap(webpackConfig(args)) : webpackConfig(args); + + const compiler = webpack(config); console.log('Building the admin panel'); diff --git a/packages/core/admin/utils/get-plugins-path.js b/packages/core/admin/utils/get-plugins-path.js new file mode 100644 index 0000000000..3fb3813f71 --- /dev/null +++ b/packages/core/admin/utils/get-plugins-path.js @@ -0,0 +1,25 @@ +'use strict'; + +const { join, resolve } = require('path'); +const fs = require('fs-extra'); +// eslint-disable-next-line node/no-extraneous-require +const glob = require('glob'); + +const getPluginsPath = () => { + const rootPath = join('..', '..', '..', 'packages'); + const corePath = join(rootPath, 'core', '*'); + const pluginsPath = join(rootPath, 'plugins', '*'); + const corePackageDirs = glob.sync(corePath); + const pluginsPackageDirs = glob.sync(pluginsPath); + const packageDirs = [...corePackageDirs, ...pluginsPackageDirs].filter(dir => { + const isCoreAdmin = dir.includes('packages/core/admin/'); + const pathToEntryPoint = join(dir, 'admin', 'src', 'index.js'); + const doesAdminFolderExist = fs.pathExistsSync(pathToEntryPoint); + + return !isCoreAdmin && doesAdminFolderExist; + }); + + return packageDirs.map(dir => resolve(__dirname, '..', join(dir, 'admin', 'src'))); +}; + +module.exports = getPluginsPath; diff --git a/packages/core/admin/webpack.config.dev.js b/packages/core/admin/webpack.config.dev.js index f3547565be..f8e3246c41 100644 --- a/packages/core/admin/webpack.config.dev.js +++ b/packages/core/admin/webpack.config.dev.js @@ -1,40 +1,15 @@ 'use strict'; const path = require('path'); -const fs = require('fs-extra'); - -// eslint-disable-next-line node/no-extraneous-require -const glob = require('glob'); const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin; const { DuplicateReporterPlugin } = require('duplicate-dependencies-webpack-plugin'); - +const getPluginsPath = require('./utils/get-plugins-path'); const webpackConfig = require('./webpack.config'); -const getPluginsPath = () => { - const rootPath = path.join('..', '..', '..', 'packages'); - const corePath = path.join(rootPath, 'core', '*'); - const pluginsPath = path.join(rootPath, 'plugins', '*'); - const corePackageDirs = glob.sync(corePath); - const pluginsPackageDirs = glob.sync(pluginsPath); - const packageDirs = [...corePackageDirs, ...pluginsPackageDirs].filter(dir => { - const isCoreAdmin = dir.includes('packages/core/admin/'); - const pathToEntryPoint = path.join(dir, 'admin', 'src', 'index.js'); - const doesAdminFolderExist = fs.pathExistsSync(pathToEntryPoint); - - return !isCoreAdmin && doesAdminFolderExist; - }); - - return packageDirs.map(dir => path.resolve(__dirname, path.join(dir, 'admin', 'src'))); -}; - module.exports = () => { const analyzeBundle = process.env.ANALYZE_BUNDLE; const analyzeDuplicateDependencies = process.env.ANALYZE_DEPS; - // Directly inject a polyfill in the webpack entry point before the entry point - // FIXME: I have noticed a bug regarding the helper-plugin and esbuild-loader - // The only I could fix it was to inject the babel polyfill - const babelPolyfill = '@babel/polyfill/dist/polyfill.min.js'; - const entry = [babelPolyfill, path.join(__dirname, 'admin', 'src')]; + const entry = path.join(__dirname, 'admin', 'src'); const dest = path.join(__dirname, 'build'); // When running the analyze:bundle command, it needs a production build @@ -44,11 +19,12 @@ module.exports = () => { backend: 'http://localhost:1337', adminPath: '/admin/', }; + const pluginsPath = getPluginsPath(); const args = { entry, cacheDir: __dirname, - pluginsPath: getPluginsPath(), + pluginsPath, dest, env, options,