Add webpack.config.js to eslint check and fix issues

[MAILPOET-3752]
This commit is contained in:
Rostislav Wolny
2021-10-08 15:36:04 +02:00
committed by Veljko V
parent c8952ce891
commit 32f577920a
2 changed files with 65 additions and 52 deletions

View File

@@ -11,7 +11,7 @@
"lint": "npm run lint6 && npm run lint-ts && npm run lint5 && npm run lint-tests", "lint": "npm run lint6 && npm run lint-ts && npm run lint5 && npm run lint-tests",
"lint6": "eslint -c .eslintrc.es6.json --max-warnings 0 'assets/js/src/**/*.jsx' 'tests/javascript/**/*.js'", "lint6": "eslint -c .eslintrc.es6.json --max-warnings 0 'assets/js/src/**/*.jsx' 'tests/javascript/**/*.js'",
"lint-ts": "eslint -c .eslintrc.ts.json --max-warnings 0 'assets/js/src/**/*.tsx' 'assets/js/src/**/*.ts'", "lint-ts": "eslint -c .eslintrc.ts.json --max-warnings 0 'assets/js/src/**/*.tsx' 'assets/js/src/**/*.ts'",
"lint5": "eslint -c .eslintrc.es5.json --max-warnings 0 'assets/js/src/**/*.js'", "lint5": "eslint -c .eslintrc.es5.json --max-warnings 0 'assets/js/src/**/*.js' 'webpack.config.js'",
"lint-tests": "eslint -c .eslintrc.tests_newsletter_editor.json --max-warnings 0 'tests/javascript_newsletter_editor'", "lint-tests": "eslint -c .eslintrc.tests_newsletter_editor.json --max-warnings 0 'tests/javascript_newsletter_editor'",
"autoprefixer": "postcss assets/dist/css/*.css --use autoprefixer --no-map --replace", "autoprefixer": "postcss assets/dist/css/*.css --use autoprefixer --no-map --replace",
"scss": "sass assets/css/src/:assets/dist/css/ --style compressed", "scss": "sass assets/css/src/:assets/dist/css/ --style compressed",

View File

@@ -1,8 +1,9 @@
const webpack = require('webpack'); const webpack = require('webpack');
const { WebpackManifestPlugin } = require('webpack-manifest-plugin'); const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
const webpackTerserPlugin = require('terser-webpack-plugin'); const WebpackTerserPlugin = require('terser-webpack-plugin');
const webpackCopyPlugin = require('copy-webpack-plugin'); const WebpackCopyPlugin = require('copy-webpack-plugin');
const path = require('path'); const path = require('path');
const globalPrefix = 'MailPoetLib'; const globalPrefix = 'MailPoetLib';
const PRODUCTION_ENV = process.env.NODE_ENV === 'production'; const PRODUCTION_ENV = process.env.NODE_ENV === 'production';
const manifestSeed = {}; const manifestSeed = {};
@@ -16,11 +17,11 @@ const baseConfig = {
context: __dirname, context: __dirname,
watchOptions: { watchOptions: {
aggregateTimeout: 300, aggregateTimeout: 300,
poll: true poll: true,
}, },
optimization: { optimization: {
minimizer: [ minimizer: [
new webpackTerserPlugin({ new WebpackTerserPlugin({
terserOptions: { terserOptions: {
// preserve identifier names for easier debugging & support // preserve identifier names for easier debugging & support
mangle: false, mangle: false,
@@ -42,22 +43,24 @@ const baseConfig = {
], ],
fallback: { fallback: {
fs: false, fs: false,
path: false, // path is used in css module, but we don't use the functionality which requires it // We need path polyfill so that eslint is able to lint webpack.config.js
// and it is imported in css module, but we don't use the functionality which requires it
path: require.resolve('path-browserify'),
}, },
extensions: ['.js', '.jsx', '.ts', '.tsx'], extensions: ['.js', '.jsx', '.ts', '.tsx'],
alias: { alias: {
'handlebars': 'handlebars/dist/handlebars.js', handlebars: 'handlebars/dist/handlebars.js',
'backbone.marionette': 'backbone.marionette/lib/backbone.marionette', 'backbone.marionette': 'backbone.marionette/lib/backbone.marionette',
'backbone.supermodel$': 'backbone.supermodel/build/backbone.supermodel.js', 'backbone.supermodel$': 'backbone.supermodel/build/backbone.supermodel.js',
'sticky-kit': 'vendor/jquery.sticky-kit.js', 'sticky-kit': 'vendor/jquery.sticky-kit.js',
'interact$': 'interact.js/interact.js', interact$: 'interact.js/interact.js',
'spectrum$': 'spectrum-colorpicker/spectrum.js', spectrum$: 'spectrum-colorpicker/spectrum.js',
'wp-js-hooks': path.resolve(__dirname, 'assets/js/src/hooks.js'), 'wp-js-hooks': path.resolve(__dirname, 'assets/js/src/hooks.js'),
'blob$': 'blob-tmp/Blob.js', blob$: 'blob-tmp/Blob.js',
'chai': 'chai/index.js', chai: 'chai/index.js',
'papaparse': 'papaparse/papaparse.min.js', papaparse: 'papaparse/papaparse.min.js',
'html2canvas': 'html2canvas/dist/html2canvas.js', html2canvas: 'html2canvas/dist/html2canvas.js',
'asyncqueue': 'vendor/jquery.asyncqueue.js', asyncqueue: 'vendor/jquery.asyncqueue.js',
}, },
}, },
plugins: [], plugins: [],
@@ -80,35 +83,35 @@ const baseConfig = {
include: require.resolve('react-tooltip'), include: require.resolve('react-tooltip'),
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.ReactTooltip', exposes: `${globalPrefix}.ReactTooltip`,
}, },
}, },
{ {
include: require.resolve('react'), include: require.resolve('react'),
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.React', exposes: `${globalPrefix}.React`,
}, },
}, },
{ {
include: require.resolve('react-dom'), include: require.resolve('react-dom'),
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.ReactDOM', exposes: `${globalPrefix}.ReactDOM`,
}, },
}, },
{ {
include: require.resolve('react-router-dom'), include: require.resolve('react-router-dom'),
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.ReactRouter', exposes: `${globalPrefix}.ReactRouter`,
}, },
}, },
{ {
include: require.resolve('react-string-replace'), include: require.resolve('react-string-replace'),
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.ReactStringReplace', exposes: `${globalPrefix}.ReactStringReplace`,
}, },
}, },
{ {
@@ -116,7 +119,7 @@ const baseConfig = {
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: { exposes: {
globalName: globalPrefix + '.Hooks', globalName: `${globalPrefix}.Hooks`,
override: true, override: true,
}, },
}, },
@@ -127,10 +130,10 @@ const baseConfig = {
{ {
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.Listing', exposes: `${globalPrefix}.Listing`,
}, },
}, },
'babel-loader' 'babel-loader',
], ],
}, },
{ {
@@ -139,11 +142,11 @@ const baseConfig = {
{ {
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.HelpTooltip', exposes: `${globalPrefix}.HelpTooltip`,
}, },
}, },
'babel-loader', 'babel-loader',
] ],
}, },
{ {
include: path.resolve(__dirname, 'assets/js/src/common/index.ts'), include: path.resolve(__dirname, 'assets/js/src/common/index.ts'),
@@ -151,25 +154,25 @@ const baseConfig = {
{ {
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.Common', exposes: `${globalPrefix}.Common`,
}, },
}, },
'babel-loader', 'babel-loader',
] ],
}, },
{ {
include: /Blob.js$/, include: /Blob.js$/,
loader: 'exports-loader', loader: 'exports-loader',
options: { options: {
exports: 'default window.Blob', exports: 'default window.Blob',
} },
}, },
{ {
test: /backbone.supermodel/, test: /backbone.supermodel/,
loader: 'exports-loader', loader: 'exports-loader',
options: { options: {
exports: 'default Backbone.SuperModel', exports: 'default Backbone.SuperModel',
} },
}, },
{ {
include: require.resolve('velocity-animate'), include: require.resolve('velocity-animate'),
@@ -187,11 +190,11 @@ const baseConfig = {
{ {
loader: 'expose-loader', loader: 'expose-loader',
options: { options: {
exposes: globalPrefix + '.ClassNames', exposes: `${globalPrefix}.ClassNames`,
}, },
}, },
'babel-loader', 'babel-loader',
] ],
}, },
{ {
test: /node_modules\/tinymce/, test: /node_modules\/tinymce/,
@@ -217,8 +220,8 @@ const baseConfig = {
], ],
}, },
}, },
] ],
} },
}; };
// Admin config // Admin config
@@ -243,16 +246,16 @@ const adminConfig = {
admin: 'webpack_admin_index.jsx', admin: 'webpack_admin_index.jsx',
newsletter_editor: 'newsletter_editor/webpack_index.jsx', newsletter_editor: 'newsletter_editor/webpack_index.jsx',
form_editor: 'form_editor/form_editor.jsx', form_editor: 'form_editor/form_editor.jsx',
settings: 'settings/index.tsx' settings: 'settings/index.tsx',
}, },
plugins: [ plugins: [
...baseConfig.plugins, ...baseConfig.plugins,
new webpackCopyPlugin({ new WebpackCopyPlugin({
patterns: [ patterns: [
{ {
from: 'node_modules/tinymce/skins/ui/oxide', from: 'node_modules/tinymce/skins/ui/oxide',
to: 'skins/ui/oxide' to: 'skins/ui/oxide',
}, },
], ],
}), }),
@@ -270,10 +273,10 @@ const adminConfig = {
minChunks: 2, minChunks: 2,
}, },
}, },
} },
}, },
externals: { externals: {
'jquery': 'jQuery', jquery: 'jQuery',
}, },
}; };
@@ -293,8 +296,8 @@ const publicConfig = {
), ),
], ],
externals: { externals: {
'jquery': 'jQuery' jquery: 'jQuery',
} },
}; };
// Migrator config // Migrator config
@@ -302,13 +305,13 @@ const migratorConfig = {
name: 'mp2migrator', name: 'mp2migrator',
entry: { entry: {
mp2migrator: [ mp2migrator: [
'mp2migrator.js' 'mp2migrator.js',
] ],
}, },
externals: { externals: {
'jquery': 'jQuery', jquery: 'jQuery',
'mailpoet': 'MailPoet' mailpoet: 'MailPoet',
} },
}; };
// Newsletter Editor Tests Config // Newsletter Editor Tests Config
@@ -360,15 +363,15 @@ const testConfig = {
modules: [ modules: [
'node_modules', 'node_modules',
'assets/js/src', 'assets/js/src',
'tests/javascript_newsletter_editor/newsletter_editor' 'tests/javascript_newsletter_editor/newsletter_editor',
], ],
extensions: ['.js', '.jsx', '.ts', '.tsx'], extensions: ['.js', '.jsx', '.ts', '.tsx'],
alias: { alias: {
'handlebars': 'handlebars/dist/handlebars.js', handlebars: 'handlebars/dist/handlebars.js',
'sticky-kit': 'vendor/jquery.sticky-kit.js', 'sticky-kit': 'vendor/jquery.sticky-kit.js',
'backbone.marionette': 'backbone.marionette/lib/backbone.marionette', 'backbone.marionette': 'backbone.marionette/lib/backbone.marionette',
'backbone.supermodel$': 'backbone.supermodel/build/backbone.supermodel.js', 'backbone.supermodel$': 'backbone.supermodel/build/backbone.supermodel.js',
'blob$': 'blob-tmp/Blob.js', blob$: 'blob-tmp/Blob.js',
'wp-js-hooks': path.resolve(__dirname, 'assets/js/src/hooks.js'), 'wp-js-hooks': path.resolve(__dirname, 'assets/js/src/hooks.js'),
}, },
fallback: { fallback: {
@@ -376,9 +379,9 @@ const testConfig = {
}, },
}, },
externals: { externals: {
'jquery': 'jQuery', jquery: 'jQuery',
'interact': 'interact', interact: 'interact',
'spectrum': 'spectrum', spectrum: 'spectrum',
}, },
}; };
@@ -389,7 +392,7 @@ const formPreviewConfig = {
form_preview: 'form_editor/form_preview.ts', form_preview: 'form_editor/form_preview.ts',
}, },
externals: { externals: {
'jquery': 'jQuery', jquery: 'jQuery',
}, },
}; };
@@ -401,7 +404,17 @@ const postEditorBlock = {
}, },
}; };
module.exports = [publicConfig, adminConfig, migratorConfig, formPreviewConfig, testConfig, postEditorBlock].map((config, index) => { const configs = [
publicConfig,
adminConfig,
migratorConfig,
formPreviewConfig,
testConfig,
postEditorBlock,
];
module.exports = configs.map((conf) => {
const config = Object.assign({}, conf);
if (config.name !== 'test') { if (config.name !== 'test') {
config.plugins = config.plugins || []; config.plugins = config.plugins || [];
config.plugins.push( config.plugins.push(