Make Quill and Draggable more modular

public/js/quill.js.LICENSE.txt

@@ -0,0 +1,15 @@
+/*!
+ * Quill Editor v1.3.7
+ * https://quilljs.com/
+ * Copyright (c) 2014, Jason Chen
+ * Copyright (c) 2013, salesforce.com
+ */
+
+/*!
+ * The buffer module from node.js, for the browser.
+ *
+ * @author   Feross Aboukhadijeh <http://feross.org>
+ * @license  MIT
+ */
+
+/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */

public/js/quill.module.js.LICENSE.txt

@@ -0,0 +1,8 @@
+/*!
+ * The buffer module from node.js, for the browser.
+ *
+ * @author   Feross Aboukhadijeh <http://feross.org>
+ * @license  MIT
+ */
+
+/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh <https://feross.org/opensource> */

public/mix-manifest.json

@@ -1,6 +1,7 @@
 {
     "/js/app.js": "/js/app.js",
-    "/js/recipes/edit.js": "/js/recipes/edit.js",
+    "/js/draggable.js": "/js/draggable.js",
+    "/js/quill.js": "/js/quill.js",
     "/css/recipes/edit.css": "/css/recipes/edit.css",
     "/css/app.css": "/css/app.css"
 }

resources/js/draggable.js

@@ -0,0 +1 @@
+window.Draggable = require('@shopify/draggable');

resources/js/quill.js

@@ -1,11 +1,2 @@
-import Quill from 'quill/core';
-
-import Toolbar from 'quill/modules/toolbar';
-import Snow from 'quill/themes/snow';
-
-Quill.register({
-    'modules/toolbar': Toolbar,
-    'themes/snow': Snow,
-});
-
-export default Quill;
+require('./quill.module');
+window.Quill = require('quill');

resources/js/quill.module.js

@@ -0,0 +1,11 @@
+import Quill from 'quill/core';
+
+import Toolbar from 'quill/modules/toolbar';
+import Snow from 'quill/themes/snow';
+
+Quill.register({
+    'modules/toolbar': Toolbar,
+    'themes/snow': Snow,
+});
+
+export default Quill;

resources/js/recipes/edit.js

@@ -1,4 +0,0 @@
-require('../quill');
-
-window.Draggable = require('@shopify/draggable');
-window.Quill = require('quill');

resources/views/recipes/edit.blade.php

@@ -182,7 +182,8 @@
 
     @once
         @push('scripts')
-            <script src="{{ asset('js/recipes/edit.js') }}"></script>
+            <script src="{{ asset('js/draggable.js') }}"></script>
+            <script src="{{ asset('js/quill.js') }}"></script>
             <script type="text/javascript">
 
                 // Enforce inline (style-base) alignment.

webpack.mix.js

@@ -13,7 +13,8 @@ const mix = require('laravel-mix');
 
 mix
     .js('resources/js/app.js', 'public/js')
-    .js('resources/js/recipes/edit.js', 'public/js/recipes')
+    .js('resources/js/draggable.js', 'public/js')
+    .js('resources/js/quill.js', 'public/js')
     .postCss('resources/css/app.css', 'public/css', [
         require('postcss-import'),
         require('tailwindcss'),