Add entrypoint for premium plugin exposed assets and libs

This simplifies Webpack configuration, removes duplicities between loaders and
the "admin_vendor" entrypoint definition, and makes the sharing more transparent.

[MAILPOET-4446]
This commit is contained in:
Jan Jakes
2022-08-08 16:24:40 +02:00
committed by Veljko V
parent 3886dd83d1
commit a01afc27e8
2 changed files with 31 additions and 185 deletions

View File

@ -0,0 +1,22 @@
// Modules that are exposed for usage in the premium plugin.
// The exports below are available via "window.MailPoetLib".
// libs
export * as ClassNames from 'classnames';
export * as React from 'react';
export * as ReactDom from 'react-dom';
export * as ReactJsxRuntime from 'react/jsx-runtime';
export * as ReactRouter from 'react-router-dom';
export * as ReactTooltip from 'react-tooltip';
export * as ReactStringReplace from 'react-string-replace';
// assets
export * as Common from 'common';
export * as CommonFormReactSelect from 'common/form/react_select/react_select';
export * as CommonFormSelect from 'common/form/select/select';
export * as CommonGrid from 'common/grid';
export * as HelpTooltip from 'help-tooltip';
export * as Hooks from 'hooks.js';
export * as Listing from 'listing';
export * as DynamicSegmentsTypes from 'segments/dynamic/types';
export * as WordPressData from 'wp-data-hooks';

View File

@ -102,6 +102,14 @@ const baseConfig = {
exclude: /(node_modules|src\/vendor)/,
loader: 'babel-loader',
},
{
include: path.resolve(
__dirname,
'assets/js/src/webpack_admin_expose.js',
),
loader: 'expose-loader',
options: { exposes: globalPrefix },
},
{
include: require.resolve('underscore'),
loader: 'expose-loader',
@ -109,161 +117,6 @@ const baseConfig = {
exposes: '_',
},
},
{
include: require.resolve('react-tooltip'),
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.ReactTooltip`,
},
},
{
include: require.resolve('react'),
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.React`,
},
},
{
include: require.resolve('react/jsx-runtime'),
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.ReactJsxRuntime`,
},
},
{
include: require.resolve('react-dom'),
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.ReactDOM`,
},
},
{
include: require.resolve('react-router-dom'),
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.ReactRouter`,
},
},
{
include: require.resolve('react-string-replace'),
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.ReactStringReplace`,
},
},
{
include: path.resolve(__dirname, 'assets/js/src/wp-data-hooks.js'),
loader: 'expose-loader',
options: {
exposes: {
globalName: `${globalPrefix}.WordPressData`,
override: true,
},
},
},
{
include: path.resolve(__dirname, 'assets/js/src/hooks.js'),
loader: 'expose-loader',
options: {
exposes: {
globalName: `${globalPrefix}.Hooks`,
override: true,
},
},
},
{
include: path.resolve(__dirname, 'assets/js/src/listing/index.ts'),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.Listing`,
},
},
'babel-loader',
],
},
{
include: path.resolve(__dirname, 'assets/js/src/help-tooltip.jsx'),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.HelpTooltip`,
},
},
'babel-loader',
],
},
{
include: path.resolve(__dirname, 'assets/js/src/common/index.ts'),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.Common`,
},
},
'babel-loader',
],
},
{
include: path.resolve(__dirname, 'assets/js/src/common/grid/index.tsx'),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.CommonGrid`,
},
},
'babel-loader',
],
},
{
include: path.resolve(
__dirname,
'assets/js/src/common/form/select/select.tsx',
),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.CommonFormSelect`,
},
},
'babel-loader',
],
},
{
include: path.resolve(
__dirname,
'assets/js/src/common/form/react_select/react_select.tsx',
),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.CommonFormReactSelect`,
},
},
'babel-loader',
],
},
{
include: path.resolve(
__dirname,
'assets/js/src/segments/dynamic/types.ts',
),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.DynamicSegmentsTypes`,
},
},
'babel-loader',
],
},
{
include: /Blob.js$/,
loader: 'exports-loader',
@ -288,18 +141,6 @@ const baseConfig = {
},
},
},
{
include: require.resolve('classnames'),
use: [
{
loader: 'expose-loader',
options: {
exposes: `${globalPrefix}.ClassNames`,
},
},
'babel-loader',
],
},
{
test: /node_modules\/tinymce/,
loader: 'string-replace-loader',
@ -334,24 +175,7 @@ const adminConfig = {
entry: {
vendor: 'webpack_vendor_index.jsx',
mailpoet: 'webpack_mailpoet_index.jsx',
// Admin vendor contains libraries shared between free and premium plugin
admin_vendor: [
'react',
'react-dom',
require.resolve('react-router-dom'),
'react-string-replace',
'prop-types',
'classnames',
'lodash',
'help-tooltip.jsx',
'listing/index.ts',
'common/index.ts',
'common/grid/index.tsx',
'common/form/select/select.tsx',
'common/form/react_select/react_select.tsx',
'wp-data-hooks.js',
'segments/dynamic/types.ts',
],
admin_vendor: ['prop-types', 'lodash', 'webpack_admin_expose.js'], // libraries shared between free and premium plugin
admin: 'webpack_admin_index.jsx',
automation: 'automation/automation.tsx',
automation_editor: 'automation/editor/index.tsx',