├── .gitignore
├── README.md
├── _config.yml
├── includes
    ├── Classes
    │   ├── AccessControl.php
    │   ├── Activator.php
    │   ├── AdminAjaxHandler.php
    │   ├── AdminApp.php
    │   ├── HelperClass.php
    │   ├── Menu.php
    │   ├── PostType.php
    │   └── index.php
    ├── autoload.php
    └── global_functions.php
├── index.php
├── languages
    └── index.php
├── license.txt
├── mix-manifest.json
├── package-lock.json
├── package.json
├── plugin-name.php
├── src
    ├── images
    │   └── logo.png
    ├── js
    │   ├── AdminApp.vue
    │   ├── Components
    │   │   ├── Dashboard.vue
    │   │   ├── Settings.vue
    │   │   └── Supports.vue
    │   ├── boot.js
    │   ├── elements.js
    │   ├── main.js
    │   ├── plugin_main_js_file.js
    │   └── routes.js
    ├── scss
    │   └── admin
    │   │   ├── app.scss
    │   │   └── global_css.scss
    └── setup.js
├── webpack.mix.js
└── yarn.lock


/.gitignore:
--------------------------------------------------------------------------------
  1 | # Logs
  2 | /.assets
  3 | logs
  4 | *.log
  5 | npm-debug.log*
  6 | yarn-debug.log*
  7 | yarn-error.log*
  8 | lerna-debug.log*
  9 | 
 10 | # Diagnostic reports (https://nodejs.org/api/report.html)
 11 | report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 12 | 
 13 | # Runtime data
 14 | pids
 15 | *.pid
 16 | *.seed
 17 | *.pid.lock
 18 | 
 19 | # Directory for instrumented libs generated by jscoverage/JSCover
 20 | lib-cov
 21 | 
 22 | # Coverage directory used by tools like istanbul
 23 | coverage
 24 | *.lcov
 25 | 
 26 | # nyc test coverage
 27 | .nyc_output
 28 | 
 29 | # Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
 30 | .grunt
 31 | 
 32 | # Bower dependency directory (https://bower.io/)
 33 | bower_components
 34 | 
 35 | # node-waf configuration
 36 | .lock-wscript
 37 | 
 38 | # Compiled binary addons (https://nodejs.org/api/addons.html)
 39 | build/Release
 40 | 
 41 | # Dependency directories
 42 | node_modules/
 43 | jspm_packages/
 44 | 
 45 | # TypeScript v1 declaration files
 46 | typings/
 47 | 
 48 | # TypeScript cache
 49 | *.tsbuildinfo
 50 | 
 51 | # Optional npm cache directory
 52 | .npm
 53 | 
 54 | # Optional eslint cache
 55 | .eslintcache
 56 | 
 57 | # Microbundle cache
 58 | .rpt2_cache/
 59 | .rts2_cache_cjs/
 60 | .rts2_cache_es/
 61 | .rts2_cache_umd/
 62 | 
 63 | # Optional REPL history
 64 | .node_repl_history
 65 | 
 66 | # Output of 'npm pack'
 67 | *.tgz
 68 | 
 69 | # Yarn Integrity file
 70 | .yarn-integrity
 71 | 
 72 | # dotenv environment variables file
 73 | .env
 74 | .env.test
 75 | 
 76 | # parcel-bundler cache (https://parceljs.org/)
 77 | .cache
 78 | 
 79 | # Next.js build output
 80 | .next
 81 | 
 82 | # Nuxt.js build / generate output
 83 | .nuxt
 84 | dist
 85 | 
 86 | # Gatsby files
 87 | .cache/
 88 | # Comment in the public line in if your project uses Gatsby and *not* Next.js
 89 | # https://nextjs.org/blog/next-9-1#public-directory-support
 90 | # public
 91 | 
 92 | # vuepress build output
 93 | .vuepress/dist
 94 | 
 95 | # Serverless directories
 96 | .serverless/
 97 | 
 98 | # FuseBox cache
 99 | .fusebox/
100 | 
101 | # DynamoDB Local files
102 | .dynamodb/
103 | 
104 | # TernJS port file
105 | .tern-port
106 | 
107 | assets/
108 | src/images/.DS_Store
109 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # WordPress boilerplate plugin with Vue.js
 2 | 
 3 | #### A simple boilerplate plugin for WordPress using vue js.
 4 | 
 5 | ## How to use:
 6 | 
 7 | * Clone this repository on your local `plugin folder`
 8 | 
 9 | * Run command `npm i` to install node modules.
10 | 
11 | Now just setup for your own plugin, it's very easy using node auto command.
12 | ##### 1. Auto setup:
13 | Just run `node src/setup`
14 | it will ask for a plugin name, type your plugin name and hit enter.
15 | 
16 | Your plugin is ready to use.
17 | 
18 | Now run `npm run watch`
19 | Then activate the plugin from your WP admin dashboard.
20 | 
21 | If you want to make setup by hand you can do it also. But auto setup is the best option for you.
22 | 
23 | <details><summary>Or Manual Setup</summary>
24 | 
25 | ## Step to make your own plugin
26 | 
27 | * Open with an IDE (Vscode, sublime, PhpStorm etc)
28 | 
29 | * Change all the   `plugin_name` to Your-Plugin-Name 
30 | * Change all the   `PLUGINNAME`  to YOURPLUGINNAME    (Upper case)
31 | * Change all the   `PluginName`  to YourPluginName    (Upper Camel Case)
32 | * Change all the   `Plugin_Name` to your_plugin_name
33 | * Change all the   `textdomain`  to yourtextdomain
34 | 
35 | </details>
36 | 
37 | ## All done have fun
38 | 
39 | 
40 | # Some suggestions for beginners:
41 | 
42 | #### Now your plugin is ready to use with a standard format.
43 | #### You can write vue.js codes inside `/src` folder
44 | #### Do any customization you need.
45 | 
46 |  ### NB: These 3 packages are already installed on this project, You can use those or remove that if you don't need.
47 |  * element-ui
48 |  * vue-router
49 |  * @Wordpress/hooks
50 |  
51 |  For more details please check the `package.json` file
52 |  
53 |  
54 |  ### After Development Production:
55 |  When your Plugin development is complete and you want to use it for production. Then run `npm run prod` after that you can delete some files which are already build.
56 |  
57 |  Files/Folder you should delete on production:
58 |  * node modules 
59 |  * src
60 |  * package-lock.json
61 |  
62 |  
63 |  ### For Help:
64 |  Please feel free to mail me <a href="mailto:hasanuzzamanbe@gmail.com">hasanuzzamanbe@gmail.com</a>
65 |  
66 |  For faster response please text me on https://www.hasanuzzaman.com live chat.
67 |  
68 |  <hr>
69 |  
70 | ### Other Setups you may Use
71 | * WordPress Plugin with Vue 3, tailwind (Vite Build) [https://github.com/hasanuzzamanbe/wp-boilerplate-vue-with-vite]
72 | * WordPress Plugin with Vue 3, tailwind (Laravel Mix Build) [https://github.com/hasanuzzamanbe/wp-plugin-with-vue-tailwind]
73 |  
74 | 


--------------------------------------------------------------------------------
/_config.yml:
--------------------------------------------------------------------------------
1 | theme: jekyll-theme-minimal


--------------------------------------------------------------------------------
/includes/Classes/AccessControl.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace PluginName\Classes;
 4 | 
 5 | class AccessControl
 6 | {
 7 |     public static function hasTopLevelMenuPermission()
 8 |     {
 9 |         $menuPermissions = array(
10 |             'manage_options',
11 |             'plugin_name_full_access',
12 |             'plugin_name_can_view_menus'
13 |         );
14 |         foreach ($menuPermissions as $menuPermission) {
15 |             if (current_user_can($menuPermission)) {
16 |                 return $menuPermission;
17 |             }
18 |         }
19 |         return false;
20 |     }
21 | }
22 | 


--------------------------------------------------------------------------------
/includes/Classes/Activator.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace PluginName\Classes;
 4 | 
 5 | if (!defined('ABSPATH')) {
 6 |     exit;
 7 | }
 8 | 
 9 | /**
10 |  * Ajax Handler Class
11 |  * @since 1.0.0
12 |  */
13 | class Activator
14 | {
15 |     public function migrateDatabases($network_wide = false)
16 |     {
17 |         global $wpdb;
18 |         if ($network_wide) {
19 |             // Retrieve all site IDs from this network (WordPress >= 4.6 provides easy to use functions for that).
20 |             if (function_exists('get_sites') && function_exists('get_current_network_id')) {
21 |                 $site_ids = get_sites(array('fields' => 'ids', 'network_id' => get_current_network_id()));
22 |             } else {
23 |                 $site_ids = $wpdb->get_col("SELECT blog_id FROM $wpdb->blogs WHERE site_id = $wpdb->siteid;");
24 |             }
25 |             // Install the plugin for all these sites.
26 |             foreach ($site_ids as $site_id) {
27 |                 switch_to_blog($site_id);
28 |                 $this->migrate();
29 |                 restore_current_blog();
30 |             }
31 |         } else {
32 |             $this->migrate();
33 |         }
34 |     }
35 | 
36 |     private function migrate()
37 |     {
38 |         /*
39 |         * database creation commented out,
40 |         * If you need any database just active this function bellow
41 |         * and write your own query at createBookmarkTable function
42 |         */
43 | 
44 |         // $this->createBookmarkTable();
45 |     }
46 | 
47 |     public function createBookmarkTable()
48 |     {
49 |         global $wpdb;
50 |         $charset_collate = $wpdb->get_charset_collate();
51 |         $table_name = $wpdb->prefix . 'plugin_name';
52 |         $sql = "CREATE TABLE $table_name (
53 |                                              pl_id int(10) NOT NULL AUTO_INCREMENT,
54 |                                              pl_name varchar(255) COLLATE utf8mb4_unicode_520_ci DEFAULT NULL,
55 |                                              chart_values varchar(255) COLLATE utf8mb4_unicode_520_ci DEFAULT NULL,
56 |                                              created_at timestamp NULL DEFAULT NULL,
57 |                                              updated_at timestamp NULL DEFAULT NULL,
58 |                                              PRIMARY KEY (chart_id)
59 |                                             ) $charset_collate;";
60 | 
61 |         $this->runSQL($sql, $table_name);
62 |     }
63 | 
64 |     private function runSQL($sql, $tableName)
65 |     {
66 |         global $wpdb;
67 |         if ($wpdb->get_var("SHOW TABLES LIKE '$tableName'") != $tableName) {
68 |             require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
69 |             dbDelta($sql);
70 |         }
71 |     }
72 | }
73 | 


--------------------------------------------------------------------------------
/includes/Classes/AdminAjaxHandler.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace PluginName\Classes;
 4 | 
 5 | class AdminAjaxHandler
 6 | {
 7 |     public function registerEndpoints()
 8 |     {
 9 |         add_action('wp_ajax_plugin_name_admin_ajax', array($this, 'handleEndPoint'));
10 |     }
11 |     public function handleEndPoint()
12 |     {
13 |         $route = sanitize_text_field($_REQUEST['route']);
14 | 
15 |         $validRoutes = array(
16 |             'get_data' => 'getData',
17 |         );
18 | 
19 |         if (isset($validRoutes[$route])) {
20 |             do_action('plugin_name/doing_ajax_forms_' . $route);
21 |             return $this->{$validRoutes[$route]}();
22 |         }
23 |         do_action('plugin_name/admin_ajax_handler_catch', $route);
24 |     }
25 | 
26 |     protected function getData()
27 |     {
28 |         // write your sql queries here or another class, then send by a success response
29 |         // wp_send_json_success($data);
30 |     }
31 | }
32 | 


--------------------------------------------------------------------------------
/includes/Classes/AdminApp.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace PluginName\Classes;
 4 | 
 5 | if (!defined('ABSPATH')) {
 6 |     exit;
 7 | }
 8 | 
 9 | /**
10 |  * Admin App Renderer and Handler
11 |  * @since 1.0.0
12 |  */
13 | class AdminApp
14 | {
15 |     public function bootView()
16 |     {
17 |         echo "<div id='plugin_name_app'></div>";
18 |     }
19 | }
20 | 


--------------------------------------------------------------------------------
/includes/Classes/HelperClass.php:
--------------------------------------------------------------------------------
1 | <?php
2 | 
3 | namespace PluginName\Classes;
4 | 
5 | class HelperClass
6 | {
7 | }
8 | 


--------------------------------------------------------------------------------
/includes/Classes/Menu.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace PluginName\Classes;
 4 | 
 5 | class Menu
 6 | {
 7 |     public function register()
 8 |     {
 9 |         add_action('admin_menu', array($this, 'addMenus'));
10 |     }
11 | 
12 |     public function addMenus()
13 |     {
14 |         $menuPermission = AccessControl::hasTopLevelMenuPermission();
15 |         if (!$menuPermission) {
16 |             return;
17 |         }
18 | 
19 |         $title = __('YourPlugin', 'textdomain');
20 |         global $submenu;
21 |         add_menu_page(
22 |             $title,
23 |             $title,
24 |             $menuPermission,
25 |             'plugin_name.php',
26 |             array($this, 'enqueueAssets'),
27 |             'dashicons-admin-site',
28 |             25
29 |         );
30 | 
31 |         $submenu['plugin_name.php']['my_profile'] = array(
32 |             __('Plugin Dashboard', 'textdomain'),
33 |             $menuPermission,
34 |             'admin.php?page=plugin_name.php#/',
35 |         );
36 |         $submenu['plugin_name.php']['settings'] = array(
37 |             __('Settings', 'textdomain'),
38 |             $menuPermission,
39 |             'admin.php?page=plugin_name.php#/settings',
40 |         );
41 |         $submenu['plugin_name.php']['supports'] = array(
42 |             __('Supports', 'textdomain'),
43 |             $menuPermission,
44 |             'admin.php?page=plugin_name.php#/supports',
45 |         );
46 |     }
47 | 
48 |     public function enqueueAssets()
49 |     {
50 |         do_action('plugin_name/render_admin_app');
51 |         wp_enqueue_script(
52 |             'plugin_name_boot',
53 |             PLUGINNAME_URL . 'assets/js/boot.js',
54 |             array('jquery'),
55 |             PLUGINNAME_VERSION,
56 |             true
57 |         );
58 | 
59 |         // 3rd party developers can now add their scripts here
60 |         do_action('plugin_name/booting_admin_app');
61 |         wp_enqueue_script(
62 |             'plugin_name_js',
63 |             PLUGINNAME_URL . 'assets/js/plugin-main-js-file.js',
64 |             array('plugin_name_boot'),
65 |             PLUGINNAME_VERSION,
66 |             true
67 |         );
68 | 
69 |         //enque css file
70 |         wp_enqueue_style('plugin_name_admin_css', PLUGINNAME_URL . 'assets/css/element.css');
71 | 
72 |         $PluginNameAdminVars = apply_filters('plugin_name/admin_app_vars', array(
73 |             //'image_upload_url' => admin_url('admin-ajax.php?action=wpf_global_settings_handler&route=wpf_upload_image'),
74 |             'assets_url' => PLUGINNAME_URL . 'assets/',
75 |             'ajaxurl' => admin_url('admin-ajax.php')
76 |         ));
77 | 
78 |         wp_localize_script('plugin_name_boot', 'PluginNameAdmin', $PluginNameAdminVars);
79 |     }
80 | }
81 | 


--------------------------------------------------------------------------------
/includes/Classes/PostType.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace PluginName\Classes;
 4 | 
 5 | if (!defined('ABSPATH')) {
 6 |     exit;
 7 | }
 8 | 
 9 | /**
10 |  * Register and initialize custom post type for plugin_name
11 |  * @since 1.0.0
12 |  */
13 | 
14 | class PostType
15 | {
16 |     public function __construct()
17 |     {
18 |         add_action('init', array($this, 'register'));
19 |     }
20 | 
21 |     public function register()
22 |     {
23 |         $args = array(
24 |             'capability_type' => 'post',
25 |             'public'          => false,
26 |             'show_ui'         => false,
27 |         );
28 |         register_post_type('plugin_name', $args);
29 |     }
30 | }
31 | 


--------------------------------------------------------------------------------
/includes/Classes/index.php:
--------------------------------------------------------------------------------
1 | <?php
2 | // Silence is golden.
3 | 


--------------------------------------------------------------------------------
/includes/autoload.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | /**
 4 |  * Autoloader
 5 |  *
 6 |  * @package PluginName
 7 |  */
 8 | 
 9 | if (!defined('ABSPATH')) {
10 |     exit;
11 | }
12 | include 'global_functions.php';
13 | if (!function_exists('PluginNameAutoload')) {
14 |     /**
15 |      * Plugin autoloader.
16 |      *
17 |      * Pattern (with or without <Subnamespace>):
18 |      *  <Namespace>/<Subnamespace>.../Class_Name (or Classname)
19 |      *  'includes/subdir.../class-name.php' or '...classname.php'
20 |      *
21 |      * @since 3.0.0
22 |      *
23 |      * @param $class
24 |      */
25 |     function PluginNameAutoload($class)
26 |     {
27 |         // Do not load unless in plugin domain.
28 |         $namespace = 'PluginName';
29 |         if (strpos($class, $namespace) !== 0) {
30 |             return;
31 |         }
32 | 
33 |         // Converts Class_Name (class convention) to class-name (file convention).
34 | 
35 |         // Remove the root namespace.
36 |         $unprefixed = substr($class, strlen($namespace));
37 | 
38 |         // Build the file path.
39 |         $file_path = str_replace('\\', DIRECTORY_SEPARATOR, $unprefixed);
40 | 
41 |         $file      = dirname(__FILE__) . $file_path . '.php';
42 |         if (file_exists($file)) {
43 |             require $file;
44 |         }
45 |     }
46 |     // Register the autoloader.
47 |     spl_autoload_register('PluginNameAutoload');
48 | }
49 | 


--------------------------------------------------------------------------------
/includes/global_functions.php:
--------------------------------------------------------------------------------
1 | <?php
2 | 
3 | // write your global functions here
4 | 


--------------------------------------------------------------------------------
/index.php:
--------------------------------------------------------------------------------
1 | <?php
2 | // Silence is golden.
3 | 


--------------------------------------------------------------------------------
/languages/index.php:
--------------------------------------------------------------------------------
1 | <?php
2 | // silence is golden
3 | 


--------------------------------------------------------------------------------
/license.txt:
--------------------------------------------------------------------------------
  1 |                     GNU GENERAL PUBLIC LICENSE
  2 |                        Version 2, June 1991
  3 | 
  4 |  Copyright (C) 1989, 1991 Free Software Foundation, Inc.,
  5 |  51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA
  6 |  Everyone is permitted to copy and distribute verbatim copies
  7 |  of this license document, but changing it is not allowed.
  8 | 
  9 |                             Preamble
 10 | 
 11 |   The licenses for most software are designed to take away your
 12 | freedom to share and change it.  By contrast, the GNU General Public
 13 | License is intended to guarantee your freedom to share and change free
 14 | software--to make sure the software is free for all its users.  This
 15 | General Public License applies to most of the Free Software
 16 | Foundation's software and to any other program whose authors commit to
 17 | using it.  (Some other Free Software Foundation software is covered by
 18 | the GNU Lesser General Public License instead.)  You can apply it to
 19 | your programs, too.
 20 | 
 21 |   When we speak of free software, we are referring to freedom, not
 22 | price.  Our General Public Licenses are designed to make sure that you
 23 | have the freedom to distribute copies of free software (and charge for
 24 | this service if you wish), that you receive source code or can get it
 25 | if you want it, that you can change the software or use pieces of it
 26 | in new free programs; and that you know you can do these things.
 27 | 
 28 |   To protect your rights, we need to make restrictions that forbid
 29 | anyone to deny you these rights or to ask you to surrender the rights.
 30 | These restrictions translate to certain responsibilities for you if you
 31 | distribute copies of the software, or if you modify it.
 32 | 
 33 |   For example, if you distribute copies of such a program, whether
 34 | gratis or for a fee, you must give the recipients all the rights that
 35 | you have.  You must make sure that they, too, receive or can get the
 36 | source code.  And you must show them these terms so they know their
 37 | rights.
 38 | 
 39 |   We protect your rights with two steps: (1) copyright the software, and
 40 | (2) offer you this license which gives you legal permission to copy,
 41 | distribute and/or modify the software.
 42 | 
 43 |   Also, for each author's protection and ours, we want to make certain
 44 | that everyone understands that there is no warranty for this free
 45 | software.  If the software is modified by someone else and passed on, we
 46 | want its recipients to know that what they have is not the original, so
 47 | that any problems introduced by others will not reflect on the original
 48 | authors' reputations.
 49 | 
 50 |   Finally, any free program is threatened constantly by software
 51 | patents.  We wish to avoid the danger that redistributors of a free
 52 | program will individually obtain patent licenses, in effect making the
 53 | program proprietary.  To prevent this, we have made it clear that any
 54 | patent must be licensed for everyone's free use or not licensed at all.
 55 | 
 56 |   The precise terms and conditions for copying, distribution and
 57 | modification follow.
 58 | 
 59 |                     GNU GENERAL PUBLIC LICENSE
 60 |    TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION
 61 | 
 62 |   0. This License applies to any program or other work which contains
 63 | a notice placed by the copyright holder saying it may be distributed
 64 | under the terms of this General Public License.  The "Program", below,
 65 | refers to any such program or work, and a "work based on the Program"
 66 | means either the Program or any derivative work under copyright law:
 67 | that is to say, a work containing the Program or a portion of it,
 68 | either verbatim or with modifications and/or translated into another
 69 | language.  (Hereinafter, translation is included without limitation in
 70 | the term "modification".)  Each licensee is addressed as "you".
 71 | 
 72 | Activities other than copying, distribution and modification are not
 73 | covered by this License; they are outside its scope.  The act of
 74 | running the Program is not restricted, and the output from the Program
 75 | is covered only if its contents constitute a work based on the
 76 | Program (independent of having been made by running the Program).
 77 | Whether that is true depends on what the Program does.
 78 | 
 79 |   1. You may copy and distribute verbatim copies of the Program's
 80 | source code as you receive it, in any medium, provided that you
 81 | conspicuously and appropriately publish on each copy an appropriate
 82 | copyright notice and disclaimer of warranty; keep intact all the
 83 | notices that refer to this License and to the absence of any warranty;
 84 | and give any other recipients of the Program a copy of this License
 85 | along with the Program.
 86 | 
 87 | You may charge a fee for the physical act of transferring a copy, and
 88 | you may at your option offer warranty protection in exchange for a fee.
 89 | 
 90 |   2. You may modify your copy or copies of the Program or any portion
 91 | of it, thus forming a work based on the Program, and copy and
 92 | distribute such modifications or work under the terms of Section 1
 93 | above, provided that you also meet all of these conditions:
 94 | 
 95 |     a) You must cause the modified files to carry prominent notices
 96 |     stating that you changed the files and the date of any change.
 97 | 
 98 |     b) You must cause any work that you distribute or publish, that in
 99 |     whole or in part contains or is derived from the Program or any
100 |     part thereof, to be licensed as a whole at no charge to all third
101 |     parties under the terms of this License.
102 | 
103 |     c) If the modified program normally reads commands interactively
104 |     when run, you must cause it, when started running for such
105 |     interactive use in the most ordinary way, to print or display an
106 |     announcement including an appropriate copyright notice and a
107 |     notice that there is no warranty (or else, saying that you provide
108 |     a warranty) and that users may redistribute the program under
109 |     these conditions, and telling the user how to view a copy of this
110 |     License.  (Exception: if the Program itself is interactive but
111 |     does not normally print such an announcement, your work based on
112 |     the Program is not required to print an announcement.)
113 | 
114 | These requirements apply to the modified work as a whole.  If
115 | identifiable sections of that work are not derived from the Program,
116 | and can be reasonably considered independent and separate works in
117 | themselves, then this License, and its terms, do not apply to those
118 | sections when you distribute them as separate works.  But when you
119 | distribute the same sections as part of a whole which is a work based
120 | on the Program, the distribution of the whole must be on the terms of
121 | this License, whose permissions for other licensees extend to the
122 | entire whole, and thus to each and every part regardless of who wrote it.
123 | 
124 | Thus, it is not the intent of this section to claim rights or contest
125 | your rights to work written entirely by you; rather, the intent is to
126 | exercise the right to control the distribution of derivative or
127 | collective works based on the Program.
128 | 
129 | In addition, mere aggregation of another work not based on the Program
130 | with the Program (or with a work based on the Program) on a volume of
131 | a storage or distribution medium does not bring the other work under
132 | the scope of this License.
133 | 
134 |   3. You may copy and distribute the Program (or a work based on it,
135 | under Section 2) in object code or executable form under the terms of
136 | Sections 1 and 2 above provided that you also do one of the following:
137 | 
138 |     a) Accompany it with the complete corresponding machine-readable
139 |     source code, which must be distributed under the terms of Sections
140 |     1 and 2 above on a medium customarily used for software interchange; or,
141 | 
142 |     b) Accompany it with a written offer, valid for at least three
143 |     years, to give any third party, for a charge no more than your
144 |     cost of physically performing source distribution, a complete
145 |     machine-readable copy of the corresponding source code, to be
146 |     distributed under the terms of Sections 1 and 2 above on a medium
147 |     customarily used for software interchange; or,
148 | 
149 |     c) Accompany it with the information you received as to the offer
150 |     to distribute corresponding source code.  (This alternative is
151 |     allowed only for noncommercial distribution and only if you
152 |     received the program in object code or executable form with such
153 |     an offer, in accord with Subsection b above.)
154 | 
155 | The source code for a work means the preferred form of the work for
156 | making modifications to it.  For an executable work, complete source
157 | code means all the source code for all modules it contains, plus any
158 | associated interface definition files, plus the scripts used to
159 | control compilation and installation of the executable.  However, as a
160 | special exception, the source code distributed need not include
161 | anything that is normally distributed (in either source or binary
162 | form) with the major components (compiler, kernel, and so on) of the
163 | operating system on which the executable runs, unless that component
164 | itself accompanies the executable.
165 | 
166 | If distribution of executable or object code is made by offering
167 | access to copy from a designated place, then offering equivalent
168 | access to copy the source code from the same place counts as
169 | distribution of the source code, even though third parties are not
170 | compelled to copy the source along with the object code.
171 | 
172 |   4. You may not copy, modify, sublicense, or distribute the Program
173 | except as expressly provided under this License.  Any attempt
174 | otherwise to copy, modify, sublicense or distribute the Program is
175 | void, and will automatically terminate your rights under this License.
176 | However, parties who have received copies, or rights, from you under
177 | this License will not have their licenses terminated so long as such
178 | parties remain in full compliance.
179 | 
180 |   5. You are not required to accept this License, since you have not
181 | signed it.  However, nothing else grants you permission to modify or
182 | distribute the Program or its derivative works.  These actions are
183 | prohibited by law if you do not accept this License.  Therefore, by
184 | modifying or distributing the Program (or any work based on the
185 | Program), you indicate your acceptance of this License to do so, and
186 | all its terms and conditions for copying, distributing or modifying
187 | the Program or works based on it.
188 | 
189 |   6. Each time you redistribute the Program (or any work based on the
190 | Program), the recipient automatically receives a license from the
191 | original licensor to copy, distribute or modify the Program subject to
192 | these terms and conditions.  You may not impose any further
193 | restrictions on the recipients' exercise of the rights granted herein.
194 | You are not responsible for enforcing compliance by third parties to
195 | this License.
196 | 
197 |   7. If, as a consequence of a court judgment or allegation of patent
198 | infringement or for any other reason (not limited to patent issues),
199 | conditions are imposed on you (whether by court order, agreement or
200 | otherwise) that contradict the conditions of this License, they do not
201 | excuse you from the conditions of this License.  If you cannot
202 | distribute so as to satisfy simultaneously your obligations under this
203 | License and any other pertinent obligations, then as a consequence you
204 | may not distribute the Program at all.  For example, if a patent
205 | license would not permit royalty-free redistribution of the Program by
206 | all those who receive copies directly or indirectly through you, then
207 | the only way you could satisfy both it and this License would be to
208 | refrain entirely from distribution of the Program.
209 | 
210 | If any portion of this section is held invalid or unenforceable under
211 | any particular circumstance, the balance of the section is intended to
212 | apply and the section as a whole is intended to apply in other
213 | circumstances.
214 | 
215 | It is not the purpose of this section to induce you to infringe any
216 | patents or other property right claims or to contest validity of any
217 | such claims; this section has the sole purpose of protecting the
218 | integrity of the free software distribution system, which is
219 | implemented by public license practices.  Many people have made
220 | generous contributions to the wide range of software distributed
221 | through that system in reliance on consistent application of that
222 | system; it is up to the author/donor to decide if he or she is willing
223 | to distribute software through any other system and a licensee cannot
224 | impose that choice.
225 | 
226 | This section is intended to make thoroughly clear what is believed to
227 | be a consequence of the rest of this License.
228 | 
229 |   8. If the distribution and/or use of the Program is restricted in
230 | certain countries either by patents or by copyrighted interfaces, the
231 | original copyright holder who places the Program under this License
232 | may add an explicit geographical distribution limitation excluding
233 | those countries, so that distribution is permitted only in or among
234 | countries not thus excluded.  In such case, this License incorporates
235 | the limitation as if written in the body of this License.
236 | 
237 |   9. The Free Software Foundation may publish revised and/or new versions
238 | of the General Public License from time to time.  Such new versions will
239 | be similar in spirit to the present version, but may differ in detail to
240 | address new problems or concerns.
241 | 
242 | Each version is given a distinguishing version number.  If the Program
243 | specifies a version number of this License which applies to it and "any
244 | later version", you have the option of following the terms and conditions
245 | either of that version or of any later version published by the Free
246 | Software Foundation.  If the Program does not specify a version number of
247 | this License, you may choose any version ever published by the Free Software
248 | Foundation.
249 | 
250 |   10. If you wish to incorporate parts of the Program into other free
251 | programs whose distribution conditions are different, write to the author
252 | to ask for permission.  For software which is copyrighted by the Free
253 | Software Foundation, write to the Free Software Foundation; we sometimes
254 | make exceptions for this.  Our decision will be guided by the two goals
255 | of preserving the free status of all derivatives of our free software and
256 | of promoting the sharing and reuse of software generally.
257 | 
258 |                             NO WARRANTY
259 | 
260 |   11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY
261 | FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW.  EXCEPT WHEN
262 | OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES
263 | PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED
264 | OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
265 | MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE.  THE ENTIRE RISK AS
266 | TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU.  SHOULD THE
267 | PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING,
268 | REPAIR OR CORRECTION.
269 | 
270 |   12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
271 | WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR
272 | REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES,
273 | INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING
274 | OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED
275 | TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY
276 | YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER
277 | PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE
278 | POSSIBILITY OF SUCH DAMAGES.
279 | 
280 |                      END OF TERMS AND CONDITIONS
281 | 
282 |             How to Apply These Terms to Your New Programs
283 | 
284 |   If you develop a new program, and you want it to be of the greatest
285 | possible use to the public, the best way to achieve this is to make it
286 | free software which everyone can redistribute and change under these terms.
287 | 
288 |   To do so, attach the following notices to the program.  It is safest
289 | to attach them to the start of each source file to most effectively
290 | convey the exclusion of warranty; and each file should have at least
291 | the "copyright" line and a pointer to where the full notice is found.
292 | 
293 |     <one line to give the program's name and a brief idea of what it does.>
294 |     Copyright (C) <year>  <name of author>
295 | 
296 |     This program is free software; you can redistribute it and/or modify
297 |     it under the terms of the GNU General Public License as published by
298 |     the Free Software Foundation; either version 2 of the License, or
299 |     (at your option) any later version.
300 | 
301 |     This program is distributed in the hope that it will be useful,
302 |     but WITHOUT ANY WARRANTY; without even the implied warranty of
303 |     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
304 |     GNU General Public License for more details.
305 | 
306 |     You should have received a copy of the GNU General Public License along
307 |     with this program; if not, write to the Free Software Foundation, Inc.,
308 |     51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
309 | 
310 | Also add information on how to contact you by electronic and paper mail.
311 | 
312 | If the program is interactive, make it output a short notice like this
313 | when it starts in an interactive mode:
314 | 
315 |     Gnomovision version 69, Copyright (C) year name of author
316 |     Gnomovision comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
317 |     This is free software, and you are welcome to redistribute it
318 |     under certain conditions; type `show c' for details.
319 | 
320 | The hypothetical commands `show w' and `show c' should show the appropriate
321 | parts of the General Public License.  Of course, the commands you use may
322 | be called something other than `show w' and `show c'; they could even be
323 | mouse-clicks or menu items--whatever suits your program.
324 | 
325 | You should also get your employer (if you work as a programmer) or your
326 | school, if any, to sign a "copyright disclaimer" for the program, if
327 | necessary.  Here is a sample; alter the names:
328 | 
329 |   Yoyodyne, Inc., hereby disclaims all copyright interest in the program
330 |   `Gnomovision' (which makes passes at compilers) written by James Hacker.
331 | 
332 |   <signature of Ty Coon>, 1 April 1989
333 |   Ty Coon, President of Vice
334 | 
335 | This General Public License does not permit incorporating your program into
336 | proprietary programs.  If your program is a subroutine library, you may
337 | consider it more useful to permit linking proprietary applications with the
338 | library.  If this is what you want to do, use the GNU Lesser General
339 | Public License instead of this License.
340 | 
341 | 


--------------------------------------------------------------------------------
/mix-manifest.json:
--------------------------------------------------------------------------------
1 | {
2 |     "/assets/js/boot.js": "/assets/js/boot.js",
3 |     "/assets/js/plugin-main-js-file.js": "/assets/js/plugin-main-js-file.js"
4 | }
5 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "plugin_name",
 3 |   "version": "1.0.0",
 4 |   "description": "A WordPress boilerplate plugin using vue.js",
 5 |   "main": "index.js",
 6 |   "scripts": {
 7 |     "dev": "npm run development",
 8 |     "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
 9 |     "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
10 |     "hot": "cross-env NODE_ENV=development webpack-dev-server --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
11 |     "prod": "npm run production",
12 |     "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
13 |   },
14 |   "dependencies": {
15 |     "@wordpress/hooks": "^2.11.1",
16 |     "element-ui": "^2.15.1",
17 |     "vue": "^2.6.12",
18 |     "vue-router": "^3.5.1"
19 |   },
20 |   "devDependencies": {
21 |     "cross-env": "^7.0.3",
22 |     "laravel-mix": "^5.0.4",
23 |     "resolve-url-loader": "^3.1.2",
24 |     "vue-template-compiler": "^2.6.12",
25 |     "sass": "^1.34.0",
26 |     "sass-loader": "8.0.2"
27 |   }
28 | }
29 | 


--------------------------------------------------------------------------------
/plugin-name.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | /*
  4 | Plugin Name: plugin_name
  5 | Plugin URI: #
  6 | Description: A WordPress boilerplate plugin with Vue js.
  7 | Version: 1.0.0
  8 | Author: #
  9 | Author URI: #
 10 | License: A "Slug" license name e.g. GPL2
 11 | Text Domain: textdomain
 12 | */
 13 | 
 14 | 
 15 | /**
 16 |  * This program is free software; you can redistribute it and/or
 17 |  * modify it under the terms of the GNU General Public License
 18 |  * as published by the Free Software Foundation; either version 2
 19 |  * of the License, or (at your option) any later version.
 20 |  *
 21 |  * This program is distributed in the hope that it will be useful,
 22 |  * but WITHOUT ANY WARRANTY; without even the implied warranty of
 23 |  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 24 |  * GNU General Public License for more details.
 25 |  *
 26 |  * You should have received a copy of the GNU General Public License
 27 |  * along with this program; if not, write to the Free Software
 28 |  *
 29 |  * Copyright 2019 Plugin Name LLC. All rights reserved.
 30 |  */
 31 | 
 32 | if (!defined('ABSPATH')) {
 33 |     exit;
 34 | }
 35 | if (!defined('PLUGINNAME_VERSION')) {
 36 |     define('PLUGINNAME_VERSION_LITE', true);
 37 |     define('PLUGINNAME_VERSION', '1.1.0');
 38 |     define('PLUGINNAME_MAIN_FILE', __FILE__);
 39 |     define('PLUGINNAME_URL', plugin_dir_url(__FILE__));
 40 |     define('PLUGINNAME_DIR', plugin_dir_path(__FILE__));
 41 |     define('PLUGINNAME_UPLOAD_DIR', '/plugin_name');
 42 | 
 43 |     class PluginName
 44 |     {
 45 |         public function boot()
 46 |         {
 47 |             if (is_admin()) {
 48 |                 $this->adminHooks();
 49 |             }
 50 |         }
 51 | 
 52 |         public function adminHooks()
 53 |         {
 54 |             require PLUGINNAME_DIR . 'includes/autoload.php';
 55 | 
 56 |             //Register Admin menu
 57 |             $menu = new \PluginName\Classes\Menu();
 58 |             $menu->register();
 59 | 
 60 |             // Top Level Ajax Handlers
 61 |             $ajaxHandler = new \PluginName\Classes\AdminAjaxHandler();
 62 |             $ajaxHandler->registerEndpoints();
 63 | 
 64 |             add_action('plugin_name/render_admin_app', function () {
 65 |                 $adminApp = new \PluginName\Classes\AdminApp();
 66 |                 $adminApp->bootView();
 67 |             });
 68 |         }
 69 | 
 70 |         public function textDomain()
 71 |         {
 72 |             load_plugin_textdomain('plugin_name', false, basename(dirname(__FILE__)) . '/languages');
 73 |         }
 74 |     }
 75 | 
 76 |     add_action('plugins_loaded', function () {
 77 |         (new PluginName())->boot();
 78 |     });
 79 | 
 80 |     register_activation_hook(__FILE__, function ($newWorkWide) {
 81 |         require_once(PLUGINNAME_DIR . 'includes/Classes/Activator.php');
 82 |         $activator = new \PluginName\Classes\Activator();
 83 |         $activator->migrateDatabases($newWorkWide);
 84 |     });
 85 | 
 86 |     // disabled admin-notice on dashboard
 87 |     add_action('admin_init', function () {
 88 |         $disablePages = [
 89 |             'plugin_name.php',
 90 |         ];
 91 |         if (isset($_GET['page']) && in_array($_GET['page'], $disablePages)) {
 92 |             remove_all_actions('admin_notices');
 93 |         }
 94 |     });
 95 | } else {
 96 |     add_action('admin_init', function () {
 97 |         deactivate_plugins(plugin_basename(__FILE__));
 98 |     });
 99 | }
100 | 


--------------------------------------------------------------------------------
/src/images/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/hasanuzzamanbe/wp-boilerplate-plugin-with-vuejs/f8fd05ec0dc3523d4126f1e964c5f591e53c2342/src/images/logo.png


--------------------------------------------------------------------------------
/src/js/AdminApp.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |     <div id="plugin_name_app">
 3 |         <div class="plugin_name_main_nav">
 4 |             <div class="topnav">
 5 |                 <router-link v-for="menuItem in topMenus" :key="menuItem.route" active-class="ninja-tab-active" exact :class="['ninja-tab']" :to="{ name: menuItem.route }">
 6 |                     {{ menuItem.title }}
 7 |                 </router-link>
 8 |             </div>
 9 | 
10 |         </div>
11 |        <router-view></router-view>
12 |     </div>
13 | </template>
14 | 
15 | <script>
16 |   export default {
17 |       name: 'AdminApp',
18 |       data() {
19 |           return {
20 |               topMenus: []
21 |           }
22 |       },
23 |       methods: {
24 |           setTopmenu() {
25 |               this.topMenus = this.applyFilters('plugin_name_top_level_menu', [
26 |                   {
27 |                       route: 'dashboard',
28 |                       title: 'Dashboard'
29 |                   },
30 |                   {
31 |                       route: 'settings',
32 |                       title: 'Settings'
33 |                   },
34 |                   {
35 |                       route: 'supports',
36 |                       title: 'Supports'
37 |                   }
38 |               ])
39 |           }
40 |       },
41 |       mounted() {
42 |           this.setTopmenu();
43 |       }
44 |   }
45 | </script>
46 | 


--------------------------------------------------------------------------------
/src/js/Components/Dashboard.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |     <div>
 3 |         <!-- example content  start -->
 4 |         <el-container>
 5 |             <el-header>
 6 |                 <h1>This is the plugin main Dashboard</h1>
 7 |             </el-header>
 8 |             <el-main>
 9 |                 <el-row>
10 |                     <el-col>
11 |                         <img width="300px" :src="$publicAssets('images/logo.png')" alt="vue">
12 |                     </el-col>
13 |                     <el-col>
14 |                         <el-button type="primary" 
15 |                             plain
16 |                             size="small"
17 |                             @click="reDirrect()"
18 |                             >Powered by Vue.js. Learn More about Vue Js <i class="el-icon-right"></i></el-button>
19 |                     </el-col>
20 |                 </el-row>  
21 |             </el-main>
22 |         </el-container>
23 |         <!-- example content end -->
24 |     </div>
25 | </template>
26 | <script>
27 | export default {
28 |     name: 'Dashboard',
29 |     data(){
30 |         return {
31 |             vueJs: 'https://vuejs.org/'
32 |         }
33 |     },
34 |     methods: {
35 |         reDirrect() {
36 |           window.open(this.vueJs, "_blank");    
37 |         }
38 |     }
39 | }
40 | </script>
41 | 
42 | 


--------------------------------------------------------------------------------
/src/js/Components/Settings.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |     <div>
 3 |         <el-container>
 4 |             <el-header>
 5 |                 <h1>This is the plugin settings page</h1>
 6 |             </el-header>
 7 |       </el-container>
 8 |     </div>
 9 | </template>
10 | <script>
11 | export default {
12 |     name: 'Settings'
13 | }
14 | </script>
15 | 
16 | 


--------------------------------------------------------------------------------
/src/js/Components/Supports.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |     <div>
 3 |         <!-- You can delete this sample data -->
 4 |        <el-container>
 5 |             <el-header>
 6 |                 <h1>This is the plugin Support page</h1>
 7 |             </el-header>
 8 |             <el-main>
 9 |                 <el-button type="info" plain @click="redirrestUrl()">For any kind of support you may knock to the developer</el-button> 
10 |             </el-main>
11 |         </el-container>
12 |         <!-- end sample data -->
13 |     </div>
14 | </template>
15 | <script>
16 | export default {
17 |     name: 'Supports',
18 |     data() {
19 |         return {
20 |             Author: 'https://www.github.com/hasanuzzamanbe'
21 |         }
22 |     },
23 |     methods:{
24 |         redirrestUrl() {
25 |             window.open(this.Author, "_blank");   
26 |         }
27 |     }
28 | }
29 | </script>
30 | 
31 | 


--------------------------------------------------------------------------------
/src/js/boot.js:
--------------------------------------------------------------------------------
1 | import PluginName from './plugin_main_js_file';
2 | 
3 | window.PluginName = new PluginName();
4 | 


--------------------------------------------------------------------------------
/src/js/elements.js:
--------------------------------------------------------------------------------
  1 | import Vue from 'vue';
  2 | import lang from 'element-ui/lib/locale/lang/en';
  3 | import locale from 'element-ui/lib/locale';
  4 | 
  5 | import {
  6 |     Button,
  7 |     ButtonGroup,
  8 |     Table,
  9 |     TableColumn,
 10 |     Dialog,
 11 |     Popover,
 12 |     Loading,
 13 |     Message,
 14 |     MessageBox,
 15 |     Icon,
 16 |     Tooltip,
 17 |     Pagination,
 18 |     Collapse,
 19 |     CollapseItem,
 20 |     Container,
 21 |     Aside,
 22 |     Main,
 23 |     Menu,
 24 |     Submenu,
 25 |     MenuItem,
 26 |     Header,
 27 |     ColorPicker,
 28 |     Form,
 29 |     FormItem,
 30 |     Input,
 31 |     Checkbox,
 32 |     RadioGroup,
 33 |     Radio,
 34 |     Select,
 35 |     Option,
 36 |     OptionGroup,
 37 |     Switch,
 38 |     CheckboxGroup,
 39 |     RadioButton,
 40 |     TabPane,
 41 |     Tabs,
 42 |     Steps,
 43 |     Step,
 44 |     Alert,
 45 |     Row,
 46 |     Col,
 47 |     Transfer,
 48 |     DatePicker,
 49 |     InputNumber,
 50 |     Dropdown,
 51 |     DropdownItem,
 52 |     DropdownMenu,
 53 |     Upload,
 54 |     Notification,
 55 |     Card
 56 | } from 'element-ui';
 57 | 
 58 | Vue.use(Button);
 59 | Vue.use(Card);
 60 | Vue.use(Dropdown);
 61 | Vue.use(Upload);
 62 | Vue.use(DropdownItem);
 63 | Vue.use(DropdownMenu);
 64 | Vue.use(ButtonGroup);
 65 | Vue.use(InputNumber);
 66 | Vue.use(DatePicker);
 67 | Vue.use(Table);
 68 | Vue.use(ColorPicker);
 69 | Vue.use(Pagination);
 70 | Vue.use(TableColumn);
 71 | Vue.use(Popover);
 72 | Vue.use(Menu);
 73 | Vue.use(Header);
 74 | Vue.use(MenuItem);
 75 | Vue.use(Loading);
 76 | Vue.use(Icon);
 77 | Vue.use(Tooltip);
 78 | Vue.use(Container);
 79 | Vue.use(Aside);
 80 | Vue.use(Main);
 81 | Vue.use(Collapse);
 82 | Vue.use(CollapseItem);
 83 | Vue.use(Dialog);
 84 | Vue.use(Form);
 85 | Vue.use(FormItem);
 86 | Vue.use(Input);
 87 | Vue.use(Select);
 88 | Vue.use(Option);
 89 | Vue.use(OptionGroup);
 90 | Vue.use(Checkbox);
 91 | Vue.use(RadioGroup);
 92 | Vue.use(Radio);
 93 | Vue.use(RadioButton);
 94 | Vue.use(Switch);
 95 | Vue.use(CheckboxGroup);
 96 | Vue.use(Tabs);
 97 | Vue.use(TabPane);
 98 | Vue.use(Steps);
 99 | Vue.use(Step);
100 | Vue.use(Alert);
101 | Vue.use(Row);
102 | Vue.use(Col);
103 | Vue.use(Transfer);
104 | Vue.use(DatePicker);
105 | Vue.use(Submenu);
106 | 
107 | Vue.use(Loading.directive);
108 | Vue.prototype.$loading = Loading.service;
109 | 
110 | Vue.prototype.$message = Message;
111 | Vue.prototype.$msgbox = MessageBox;
112 | Vue.prototype.$alert = MessageBox.alert;
113 | Vue.prototype.$confirm = MessageBox.confirm;
114 | Vue.prototype.$prompt = MessageBox.prompt;
115 | Vue.prototype.$notify = Notification;
116 | 
117 | locale.use(lang);
118 | 
119 | export default Vue;
120 | 


--------------------------------------------------------------------------------
/src/js/main.js:
--------------------------------------------------------------------------------
 1 | window.PluginNameBus = new window.PluginName.Vue();
 2 | 
 3 | window.PluginName.Vue.mixin({
 4 |     methods: {
 5 |         applyFilters: window.PluginName.applyFilters,
 6 |         addFilter: window.PluginName.addFilter,
 7 |         addAction: window.PluginName.addFilter,
 8 |         doAction: window.PluginName.doAction,
 9 |         $get: window.PluginName.$get,
10 |         $adminGet: window.PluginName.$adminGet,
11 |         $adminPost: window.PluginName.$adminPost,
12 |         $post: window.PluginName.$post,
13 |         $publicAssets: window.PluginName.$publicAssets
14 |     }
15 | });
16 | 
17 | import {routes} from './routes';
18 | 
19 | const router = new window.PluginName.Router({
20 |     routes: window.PluginName.applyFilters('PluginName_global_vue_routes', routes),
21 |     linkActiveClass: 'active'
22 | });
23 | 
24 | import App from './AdminApp';
25 | 
26 | new window.PluginName.Vue({
27 |     el: '#plugin_name_app',
28 |     render: h => h(App),
29 |     router: router
30 | });
31 | 
32 | 


--------------------------------------------------------------------------------
/src/js/plugin_main_js_file.js:
--------------------------------------------------------------------------------
 1 | import Vue from './elements';
 2 | import Router from 'vue-router';
 3 | Vue.use(Router);
 4 | 
 5 | import { applyFilters, addFilter, addAction, doAction } from '@wordpress/hooks';
 6 | 
 7 | export default class PluginName {
 8 |     constructor() {
 9 |         this.applyFilters = applyFilters;
10 |         this.addFilter = addFilter;
11 |         this.addAction = addAction;
12 |         this.doAction = doAction;
13 |         this.Vue = Vue;
14 |         this.Router = Router;
15 |     }
16 | 
17 |     $publicAssets(path){
18 |         return (window.PluginNameAdmin.assets_url + path);
19 |     }
20 | 
21 |     $get(options) {
22 |         return window.jQuery.get(window.PluginNameAdmin.ajaxurl, options);
23 |     }
24 | 
25 |     $adminGet(options) {
26 |         options.action = 'plugin_name_admin_ajax';
27 |         return window.jQuery.get(window.PluginNameAdmin.ajaxurl, options);
28 |     }
29 | 
30 |     $post(options) {
31 |         return window.jQuery.post(window.PluginNameAdmin.ajaxurl, options);
32 |     }
33 | 
34 |     $adminPost(options) {
35 |         options.action = 'plugin_name_admin_ajax';
36 |         return window.jQuery.post(window.PluginNameAdmin.ajaxurl, options);
37 |     }
38 | 
39 |     $getJSON(options) {
40 |         return window.jQuery.getJSON(window.PluginNameAdmin.ajaxurl, options);
41 |     }
42 | }
43 | 


--------------------------------------------------------------------------------
/src/js/routes.js:
--------------------------------------------------------------------------------
 1 | import Dashboard from './Components/Dashboard';
 2 | import Settings from './Components/Settings';
 3 | import Supports from './Components/Supports';
 4 | 
 5 | export const routes = [
 6 |     {
 7 |         path: '/',
 8 |         name: 'dashboard',
 9 |         component: Dashboard
10 |     },
11 |     {
12 |         path: '/settings',
13 |         name: 'settings',
14 |         component: Settings
15 |     },
16 |     {
17 |         path: '/supports',
18 |         name: 'supports',
19 |         component: Supports
20 |     }
21 | ];
22 | 


--------------------------------------------------------------------------------
/src/scss/admin/app.scss:
--------------------------------------------------------------------------------
 1 | // Import Libraries
 2 | @import '~element-ui/lib/theme-chalk/base.css';
 3 | @import '~element-ui/lib/theme-chalk/input-number.css';
 4 | @import '~element-ui/lib/theme-chalk/table.css';
 5 | @import '~element-ui/lib/theme-chalk/popover.css';
 6 | @import '~element-ui/lib/theme-chalk/loading.css';
 7 | @import '~element-ui/lib/theme-chalk/message.css';
 8 | @import '~element-ui/lib/theme-chalk/message-box.css';
 9 | @import '~element-ui/lib/theme-chalk/tooltip.css';
10 | @import '~element-ui/lib/theme-chalk/pagination.css';
11 | @import '~element-ui/lib/theme-chalk/collapse.css';
12 | @import '~element-ui/lib/theme-chalk/collapse-item.css';
13 | @import '~element-ui/lib/theme-chalk/dialog.css';
14 | @import '~element-ui/lib/theme-chalk/aside.css';
15 | @import '~element-ui/lib/theme-chalk/main.css';
16 | @import '~element-ui/lib/theme-chalk/container.css';
17 | @import '~element-ui/lib/theme-chalk/menu.css';
18 | @import '~element-ui/lib/theme-chalk/menu-item.css';
19 | @import '~element-ui/lib/theme-chalk/header.css';
20 | @import '~element-ui/lib/theme-chalk/color-picker.css';
21 | @import '~element-ui/lib/theme-chalk/form.css';
22 | @import '~element-ui/lib/theme-chalk/form-item.css';
23 | @import '~element-ui/lib/theme-chalk/radio-group.css';
24 | @import '~element-ui/lib/theme-chalk/radio.css';
25 | @import '~element-ui/lib/theme-chalk/switch.css';
26 | @import '~element-ui/lib/theme-chalk/radio-button.css';
27 | @import '~element-ui/lib/theme-chalk/button.css';
28 | @import '~element-ui/lib/theme-chalk/button-group.css';
29 | @import '~element-ui/lib/theme-chalk/tabs.css';
30 | @import '~element-ui/lib/theme-chalk/tab-pane.css';
31 | @import '~element-ui/lib/theme-chalk/steps.css';
32 | @import '~element-ui/lib/theme-chalk/step.css';
33 | @import '~element-ui/lib/theme-chalk/alert.css';
34 | @import '~element-ui/lib/theme-chalk/option.css';
35 | @import '~element-ui/lib/theme-chalk/option-group.css';
36 | @import '~element-ui/lib/theme-chalk/row.css';
37 | @import '~element-ui/lib/theme-chalk/col.css';
38 | @import '~element-ui/lib/theme-chalk/transfer.css';
39 | @import '~element-ui/lib/theme-chalk/date-picker.css';
40 | @import '~element-ui/lib/theme-chalk/popover.css';
41 | @import '~element-ui/lib/theme-chalk/dropdown.css';
42 | @import '~element-ui/lib/theme-chalk/dropdown-menu.css';
43 | @import '~element-ui/lib/theme-chalk/dropdown-item.css';
44 | @import '~element-ui/lib/theme-chalk/upload.css';
45 | @import '~element-ui/lib/theme-chalk/notification.css';
46 | @import '~element-ui/lib/theme-chalk/icon.css';
47 | @import '~element-ui/lib/theme-chalk/card.css';
48 | 
49 | @import './global_css.scss';
50 | 
51 | 


--------------------------------------------------------------------------------
/src/scss/admin/global_css.scss:
--------------------------------------------------------------------------------
 1 | .topnav {
 2 |     background-color: #fff;
 3 |     overflow: hidden;
 4 |     border-top: 1px solid #32373c2b;
 5 |     border-bottom: 1px solid #32373c2b;
 6 |     width: 100%;
 7 |     /* Style the links inside the navigation bar */
 8 |     a {
 9 |         float: left;
10 |         color: black;
11 |         text-align: center;
12 |         padding: 14px 16px;
13 |         text-decoration: none;
14 |         font-size: 17px;
15 |     }
16 | 
17 |     /* Change the color of links on hover */
18 |     a:hover {
19 |         background-color: #ddd;
20 |         color: black;
21 |     }
22 | 
23 |     /* Add a color to the active/current link */
24 |     a.ninja-tab-active {
25 |         color: #ffa92c;
26 |         border-bottom: 2px solid #ffa92c;
27 |     }
28 | }


--------------------------------------------------------------------------------
/src/setup.js:
--------------------------------------------------------------------------------
  1 | var readline = require('readline');
  2 | 
  3 | var rl = readline.createInterface({
  4 |   input: process.stdin,
  5 |   output: process.stdout
  6 | });
  7 | 
  8 | function convertToSlug(Text)
  9 | {
 10 |     return Text
 11 |         .toLowerCase()
 12 |         .replace(/ /g,'-')
 13 |         .replace(/[^\w-]+/g,'')
 14 |         ;
 15 | }
 16 | 
 17 | function convertToLowercase(Text)
 18 | {
 19 |     return Text
 20 |         .toLowerCase()
 21 |         .replace(/ /g,'')
 22 |         .replace(/[^\w-]+/g,'')
 23 |         ;
 24 | }
 25 | 
 26 | function camalize(str) {
 27 |   return str.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, function(match, chr)
 28 |   {
 29 |       return chr.toUpperCase();
 30 |   });
 31 | }
 32 | 
 33 | function convertToUpperCamel(Text)
 34 | {
 35 |     return Text
 36 |         .to()
 37 |         .replace(/ /g,'')
 38 |         .replace(/[^\w-]+/g,'')
 39 |         ;
 40 | }
 41 | 
 42 | function convertToUppercase(Text)
 43 | {
 44 |     return Text
 45 |         .toUpperCase()
 46 |         .replace(/ /g,'')
 47 |         .replace(/[^\w-]+/g,'')
 48 |         ;
 49 | }
 50 | 
 51 | 
 52 | rl.question("Please enter your plugin Name:", function(answer) {
 53 | 
 54 |   if(!answer.includes("-")){
 55 |     answer = answer.replace(/\s+$/, '');
 56 |     var glob = require('glob');
 57 |     var fs = require('fs');
 58 |     
 59 |   
 60 |     // For entry file selection
 61 |     glob("plugin-name.php", function(err, files) {
 62 |           files.forEach(function(item, index, array) {
 63 |             
 64 |             var data = fs.readFileSync(item, 'utf8');
 65 |             var Uppercase = convertToUppercase(answer);
 66 |             var Lowercase = convertToLowercase(answer);
 67 |             var Slug      = convertToSlug(answer);
 68 |             var Camel     = camalize(answer);
 69 |         
 70 |             var mapObj = {
 71 |               PluginName: Camel,
 72 |               plugin_name: Slug,
 73 |               PLUGINNAME: Uppercase,
 74 |               pluginname: Lowercase
 75 |            };
 76 |            var result = data.replace(/PluginName|plugin_name|PLUGINNAME|pluginname/gi, function(matched){
 77 |              return mapObj[matched];
 78 |            });
 79 |             fs.writeFile(item, result, 'utf8', function (err) {
 80 |                 if (err) return console.log(err);
 81 |             });
 82 |             console.log('✅ Plugin Entry file generated.');
 83 |         });
 84 |     });
 85 |   
 86 |     glob("includes/autoload.php*", function(err, files) {
 87 |   
 88 |       files.forEach(function(item, index, array) {
 89 |             
 90 |                 var data = fs.readFileSync(item, 'utf8');
 91 |                 var Uppercase = convertToUppercase(answer);
 92 |                 var Lowercase = convertToLowercase(answer);
 93 |                 var Slug      = convertToSlug(answer);
 94 |                 var Camel     = camalize(answer);
 95 |             
 96 |                 var mapObj = {
 97 |                   PluginName: Camel,
 98 |                   plugin_name: Slug,
 99 |                   PLUGINNAME: Uppercase,
100 |                   pluginname: Lowercase
101 |                };
102 |                var result = data.replace(/PluginName|plugin_name|PLUGINNAME|pluginname/gi, function(matched){
103 |                  return mapObj[matched];
104 |                });
105 |                 fs.writeFile(item, result, 'utf8', function (err) {
106 |                     if (err) return console.log(err);
107 |                 });
108 |                 console.log('✅ Class making Successful !');
109 |             });
110 |     });
111 |   
112 |     // Find file(s) except node and entry
113 |     glob("!(node_modules)/*/*.*", function(err, files) {
114 |         if (err) { throw err; }
115 |     
116 |         files.forEach(function(item, index, array) {
117 |   
118 |               // Read fileclear
119 |               var data = fs.readFileSync(item, 'utf8');
120 |   
121 |          
122 |               var Uppercase = convertToUppercase(answer);
123 |               var Lowercase = convertToLowercase(answer);
124 |               var Slug      = convertToSlug(answer);
125 |               var Camel     = camalize(answer);
126 |            
127 |   
128 |               var mapObj = {
129 |                 YourPlugin: answer,
130 |                 PluginName: Camel,
131 |                 plugin_name: Slug,
132 |                 PLUGINNAME: Uppercase,
133 |                 pluginname: Lowercase
134 |              };
135 |              var result = data.replace(/YourPlugin|PluginName|plugin_name|PLUGINNAME|pluginname/gi, function(matched){
136 |                return mapObj[matched];
137 |              });
138 |     
139 |               fs.writeFile(item, result, 'utf8', function (err) {
140 |                   if (err) return console.log(err);
141 |               });
142 |               console.log('✅ file:('+item +') '+'=>Generated');
143 |           });
144 |           console.log(` 
145 |       
146 |     _______ _______ _______ ________        _______________________ ______  
147 |    (  ____ (  ___  (       (  ____ ( \      (  ____  \__   __(  ____ (  __  ) 
148 |    | (    \ | (   ) | () () | (    )| (     | (     \/  ) (  | (     \| (  )  )
149 |    | |     | |   | | || || | (____)| |     | (__      | |  | (__   | |   ) |
150 |    | |     | |   | | |(_)| |  _____| |     |  __)     | |  |  __)  | |   | |
151 |    | |     | |   | | |   | | (     | |     | (        | |  | (     | |   ) |
152 |    | (____/| (___) | )   ( | )     | (____/| (____/\   | |  | (____/| (__/  )
153 |    (_______(_______|/     (|/      (_______(_______/  )_(  (_______(______/ 
154 |                                                                                                             
155 |           All File Processed Successfully!
156 |           Now run "npm run watch" and activate your plugin.
157 |           Thanks from https://www.hasanuzzaman.com`)
158 |     });
159 |   
160 |     fs.unlink('_config.yml', (err) => {
161 |       if (err) {
162 |         console.log('✅ No unused file here')
163 |         return
164 |       }
165 |       console.log('✅ unused file removed');
166 |     })
167 | 
168 |     // Closing all inputs
169 |     rl.close();
170 |   }else {
171 |     var suggestion = answer.replace(/-/g, ' ');
172 |     console.log('⚠️ Warning: Please don\'t use hyfen. You may use '+ suggestion + ' as your plugin name');
173 |     console.log('⚠️ Please run again "node src/seup" and enter a unique plugin name.');
174 |   }
175 |  
176 |  
177 | });
178 | 
179 | 


--------------------------------------------------------------------------------
/webpack.mix.js:
--------------------------------------------------------------------------------
 1 | let mix = require('laravel-mix');
 2 | mix.setPublicPath('assets');
 3 | 
 4 | mix.setResourceRoot('../');
 5 | mix
 6 |     .js('src/js/boot.js', 'assets/js/boot.js')
 7 |     .js('src/js/main.js', 'assets/js/plugin-main-js-file.js')
 8 |     .copy('src/images', 'assets/images')
 9 |     .sass('src/scss/admin/app.scss', 'assets/css/element.css');
10 |     


--------------------------------------------------------------------------------