0

Intro

When developing a gulp.js project, it is typical to have the following directory structure

PROJECT_NAME
    |
    ---------- dist <------------ contains library to be released
    |
    ---------- src <------------- contains all source code file

And the coding flow is

  1. Create source files in the src directory
  2. Once the files in src work as designed, the project is "uglified" and "minimized", then copied to the dist directory.
  3. Once the dist directory has the final project, it is released.

So, the released version of the library is taken from the dist directory.

Setup for WordPress

Now, onto WordPress. I typically set my development environment as follows

WORDPRESS_ROOT_DIRECTORY
    |
  wp-content
    |
  plugins
    |
  my_plugin
    |
    -------- css  <---------- contains all CSS files
    |
    -------- inc  <---------- contains all PHP files
    |
    -------- js   <---------- contains all JavaScript files
    |
    -------- vendors <------- contains all libraries from other vendors
    |
    -------- my_plugin.php <---- this is the initial plugin file

This setup for WordPress would be OK and I have been developing plugins for it without a problem. I would develop, test, and then release.

The Issue

In my current WordPress project, I am developing a plugin that would require I minimize and uglify every file in the directory (the reasons for that are long, and I am not going into the business cases; it is a requirement). Typically I would like to create the following directory structure.

WORDPRESS_ROOT_DIRECTORY
    |
  wp-content
    |
  plugins
    |
  my_plugin
    |
    -------- dist <------ contains all minimized and uglified files
    |
    -------- src
              |
              -------- css  <---------- contains all CSS files
              |
              -------- inc  <---------- contains all PHP files
              |
              -------- js   <---------- contains all JavaScript files
              |
              -------- vendors <------- contains all libraries from other vendors
              |
              -------- my_plugin.php <---- this is the initial plugin file

Then, the ideal flow of development would be

  1. Develop in the src directory
  2. Once satified, minimize/uglify all PHP, CSS, and JS files into dist
  3. Release the plugin from the dist directory

I have the following problems

  1. I do not know if I can make such setup work. The problem is I will have functions that have the same name (referenced from my_plugin.php located in src and the minimized 'my_plugin.php' located in dist), and this would cause a WordPress function name conflict error.

  2. Can I place my root plugin file, my_plugin.php, in a sub/sub directory?

  3. I am not sure what tools I can use to take my files from src and convert them to dist while minimizing/uglifying them. I could use gulp.js to do that for my JS and CSS files, but I am not sure about PHP files. I need one tool that does that for all files.

If I am unable to create the structure above. How can I minimize/uglify ALL my files for my plugin before releasing the plugin? (And by ALL files, I mean PHP, CSS, and JS).

Thanks.

  • sorry, but this sound like a software packaging question. as it is right now it is not clear to me which aspects of the question are wordpress specific? If you need just write a more complex build script – Mark Kaplun Mar 9 '18 at 23:53
  • Thanks @MarkKaplun for your reply. You are right, it is a packaging question, but it is related to WordPress. I am not asking for a script to package. I am asking if it is possible to do so, and what tools to use (either directly within the build, or indirectly outside the build). – Greeso Mar 9 '18 at 23:58
  • related !== specific. Questions here needs to be specific, otherwise we will end up with questions about how to use phpstorm and other editors. – Mark Kaplun Mar 10 '18 at 0:11
  • I have to disagree with you. The points in the question are specific in its inquiry. Obviously you cannot help in answering it. – Greeso Mar 10 '18 at 6:53
  • I actually told you what the answer is :(... write better build script – Mark Kaplun Mar 10 '18 at 7:12
1
+50

The simplest solution is to keep your source in the root of the plugin folder (i.e. your typical WordPress setup listed above). Your build script should write its output to a dist folder at the root of the plugin.

This prevents any possible WordPress conflicts; PHP and WordPress won't parse a file unless it is referenced with an include, require or otherwise in your code. So my_plugin.php in the root of the plugin and in the dist folder won't conflict at all.

  • Thanks. What build scripts do you recommend? – Greeso Mar 14 '18 at 3:35
  • Generally I use grunt. But there any build tool should support this. – Steve Mar 14 '18 at 15:32
  • OK, I will try to use gulp. Thanks for your help. You gave me ideas of how to solve this issue. – Greeso Mar 14 '18 at 16:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.