I am developing a simple WordPress app but I am having an issue as all of the plugin scripts are rendered before those which are enqueued in my functions.php
.
Here is a sample section of the functions.php
:
function my_scripts() {
wp_register_script('app-js', get_template_directory_uri() . '/javascripts/app.js', array('jquery'), null, true );
wp_enqueue_script('app-js');
}
add_action( 'wp_enqueue_scripts', 'my_scripts');
The important this to note is that (following best practice my JS is set to render at the bottom of the page.
I also have couple of plugins running on the theme. The problem is that the output looks like this:
<!-- Note the plugin appears first -->
<script type='text/javascript' src='http://localhost/wordpress/wp-content/plugins/my-plugin/acl-plugin.js'></script>
<!-- And the main JS appears second -->
<script type='text/javascript' src='http://localhost/wordpress/wp-content/themes/my-theme/javascripts/app.js'></script>
</body>
</html>
How can I force WordPress to display the main JS (which I believe is rendered by wp_head()
) to appear above the plugin scripts? That way the plugins can reference JS functions that are in the main theme.
Try and use/add the priority parameter of the hook for
app.js
and see if it works.add_action( 'wp_enqueue_scripts', 'my_scripts', 1 );
By default it is 10, so lets call it early and see if this works for you