From ff5b1598c918b12ff9b222b0397b43d0ed5ffae6 Mon Sep 17 00:00:00 2001 From: Daniel Weipert Date: Wed, 28 Oct 2020 20:03:06 +0100 Subject: Gets local copies of needed codemirror js and css files via webpack and enqueues those instead of the remote files --- .gitignore | 2 ++ composer.json | 11 +++++++++++ editor-for-timber.php | 4 ++++ package.json | 16 ++++++++++++++++ src/ThemeEditor.php | 4 ++-- webpack.config.js | 26 ++++++++++++++++++++++++++ 6 files changed, 61 insertions(+), 2 deletions(-) create mode 100644 package.json create mode 100644 webpack.config.js diff --git a/.gitignore b/.gitignore index 57872d0..17ff999 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,3 @@ +/assets/ +/node_modules/ /vendor/ diff --git a/composer.json b/composer.json index 4adf8ee..0bf4609 100644 --- a/composer.json +++ b/composer.json @@ -15,5 +15,16 @@ "psr-4": { "TimberEditor\\": "src/" } + }, + "archive": { + "exclude": [ + "*", ".*", + "!/assets", + "!/src", + "!/vendor", + "!/composer.json", + "!/editor-for-timber.php", + "!/LICENSE", "!/readme.txt" + ] } } diff --git a/editor-for-timber.php b/editor-for-timber.php index 1dea60c..5900160 100644 --- a/editor-for-timber.php +++ b/editor-for-timber.php @@ -14,3 +14,7 @@ add_action('plugins_loaded', 'timberEditor'); function timberEditor() { new \TimberEditor\TimberEditor(); } + +function timberEditorAssetsUrl($path) { + return plugins_url("assets/$path", __FILE__); +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..cbfc718 --- /dev/null +++ b/package.json @@ -0,0 +1,16 @@ +{ + "name": "@dweipert/timber-editor", + "main": "webpack.config.js", + "scripts": { + "start": "webpack" + }, + "dependencies": { + "codemirror": "^5" + }, + "devDependencies": { + "copy-webpack-plugin": "^6.2.1", + "css-minimizer-webpack-plugin": "^1.1.5", + "webpack": "^5.3.0", + "webpack-cli": "^4.1.0" + } +} diff --git a/src/ThemeEditor.php b/src/ThemeEditor.php index 0b62264..194b59d 100644 --- a/src/ThemeEditor.php +++ b/src/ThemeEditor.php @@ -62,12 +62,12 @@ class ThemeEditor 'wp-codemirror', 'window.CodeMirror = wp.CodeMirror;' ); - wp_enqueue_script('mode-twig', 'https://unpkg.com/codemirror@5/mode/twig/twig.js', ['wp-codemirror']); + wp_enqueue_script('codemirror-mode-twig', timberEditorAssetsUrl('codemirror/mode/twig/twig.js'), ['wp-codemirror']); } $theme = $settings['codemirror']['theme']; if ($theme != 'default') { - wp_enqueue_style('codemirror-theme', "https://unpkg.com/codemirror@5/theme/$theme.css", ['wp-codemirror']); + wp_enqueue_style('codemirror-theme', timberEditorAssetsUrl("codemirror/theme/$theme.css"), ['wp-codemirror']); } } } diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 0000000..9e2680e --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,26 @@ +const CopyWebpackPlugin = require('copy-webpack-plugin'); +const CssMinimizerPlugin = require('css-minimizer-webpack-plugin'); + +module.exports = { + entry: {}, + output: { + path: __dirname, + }, + + plugins: [ + new CopyWebpackPlugin({ + patterns: [ + { from: __dirname + '/node_modules/codemirror/mode/twig/twig.js', to: __dirname + '/assets/codemirror/mode/twig/twig.js' }, + { from: __dirname + '/node_modules/codemirror/theme', to: __dirname + '/assets/codemirror/theme' }, + ], + }), + ], + + // minimize copied js and css + optimization: { + minimizer: [ + `...`, + new CssMinimizerPlugin(), + ], + }, +}; -- cgit v1.2.3