I have a small Vue app and I want to use it as a plugin in Wordpress. I got this working without problems. The only challenge I have is to get Vite to use the PHP plugin file as the entry point instead of the usual index.html.
This is problematic because the build gives the bundles a unique file name by adding a hash, like index-eb5dc3f1.js. The index.html is generated during the build and automatically links to the unique files, but I need to manually change the PHP file after every build. I want to keep this mechanism of unique bundle names.
As a workaround I have changed my vite.config.js so vite no longer adds the hash:
build: {
rollupOptions: {
output: {
entryFileNames: `assets/[name].js`,
chunkFileNames: `assets/[name].js`,
assetFileNames: `assets/[name].[ext]`
}
}
}
And in the WordPress plugin I am adding it like:
wp_register_script('the-plugin', plugin_dir_url( __FILE__ ).'assets/index.js', true );
This works, but I rather would keep the hashes in the file name. Is there a possibility to let Vite alter the PHP file?
I have tried adding input: 'index.php', to the rollupOptions, but it is choaking on the PHP:
error during build:
RollupError: Unexpected token (Note that you need plugins to import files that are not JavaScript)
Related
I'm newbie in Codeigniter. Almost the whole time ago I use NodeJS. Can you show me how to control public resource in Codeigniter like Express? I want use /js/dev in development mode instead of /js.
example:
When first load web page with path: http://xxxx.com/js/default.js will get content from /js/dev/default.js instead of /js/default.js at development mode
Below is my code in Express for this idea.
if (process.env.NODE_ENV === 'development') {//path dev -> min to product
app.use('/js', express.static('client/js/dev'))
app.use('/css', express.static('client/css/dev'))
}
You can create any folder on your root directory. After that you can access those files with base_url(), be sure your base_url is correct, you can change it on 'application/config/config.php'
<?php
echo base_url('public/js/xyz.js');
echo base_url('uploads/img/15.jpg');
I'm starting a new php project and I'm trying to learn new techniques (for me). Grunt, yeoman etc.
Now I want to start a php project and found this example from Bradleycorn => generator-php. As far as I think, I have everything working, but I can't rund my development local site using grunt server. I'm getting a error:
Running "php:server" (php) task
Invalid address: http://localhost/myproject.nl:80
I have this folder structure:
\Applications\XAMPP\xamppfiles\htdocs\myproject.nl\
Beneath this folder:
myproject\
|--.sass-cache\
|--.tmp\
|--app\
|--dist\
|--node_modules\
|--bower.json
|--Grunftile.js
|--package.jason
|--router-dist.php
|--router.php
In the Gruntfile.js this code is placed (part of the code with the dev URL):
module.exports = function (grunt) {
// load all grunt tasks
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
// CONFIGURABLE PATHS
// The yeomanConfig object contains file paths and other "constants" that are used throughout
// The rest of this Gruntfile. Basically, any value that is used in multiple places should be
// put here for ease of maintenance. Update the value here, and all other places are updated
// automagically.
var yeomanConfig = {
app: 'app',
dist: 'dist',
siteURL: 'www.myproject.nl',
devURL: 'http://localhost/myproject.nl',
devPort: 80
};
I also tried this devURL http://localhost/myproject.nl/myproject/dist:, but also not working. What should the devURL be in this case?
PS: I also want to run a local database, I'm using XAMPP for that.
NOTE: I already use wp_dequeue_script or wp_deregister_script but not successfull
Here is the scenario, i make a image slider plugin that use jquery-cycle2 and it work successfully.
There is a user who used a wp theme and in theme there is a jquery-cycle1, now when he install my plugin the jquery-cycle1 and jquery-cycle2 conflicts, when user delete the jquery-cycle1 file all things work fine and perfectly but i don't want to delete file by user.
Now i am trying that when user install my plugin the jquery-cycle1 in theme close or deregister or stop its effect.
I get file from theme successfully
if((file_exists($theme_file_path."/jquery.cycle.all.js"))){
echo "yes";
}
but i have no idea to close jquery-cycle1 file or stop its effect.
Last Option: I have last solution that delete the file from theme but its my last option.
Please any suggestions, help me.
You will have to place an incompatibility notice on your theme.
It is not possible to attempt to detect the existence of script from server side. You are able to detect queued scripts via the word press methods, however, this assumes that the user has not simply linked the file with a <script></script> tag. The file_exists method assume the file is stored on the server itself - it could be linked from a CDN or another server.
Also, whatever methods you use to detect and remove jQuery-Cycle; You are going to break any feature on the site that uses the existing plugin.
Thus, any solution you able to devise would either be extremely complicated, or would not be generalised enough to account for all these possibilities.
You may be able to use the following to prevent loading your script
if (jQuery().cycle) {
// Script already loaded
console.log("Error: Another version of jQuery-Cycle is already loaded!");
} else {
// Load your script
}
but this cannot unload what is already loaded.
There is a simple hack you can do on you end. In the Cycle2 source replace all $.fn.cycle with $.fn.cycle2 and ).cycle( to ).cycle2(.
I am using the source from here http://malsup.github.io/jquery.cycle2.js
After that You can access it like
$("#id").cycle2({option})
Here is a demo http://jsfiddle.net/33g6z79h/
Here i assume that you are not using cycle events http://jquery.malsup.com/cycle2/api/#events
and cycle extra transitions.
If you are using it you can make a fiddle for your cycle2 implementation and i would be glad to help :)
I have a complex php application which I want to include in a typo3 page. I allready found something like this:
page.headerData.20 = PHP_SCRIPT_EXT
page.headerData.20.file = fileadmin/phpScript.inc
...but this inserts the file to template, I just want to show it on one single page instead of content. The application is currently included as an iFrame (same domain) but that's not the best way because the window doesn't resize.
In also think abouth to convert the whole app to typo3 plugin, but I'm very new to typo3 so I don't now how to start. Is there a guide for converting plain php to typo3 plugin?
Hi you can use a simple user extension.
Some where in Typoscript Setup:
includeLibs.mystuff = path_to_file/my_user_class.php
lib.mystuff = USER_INT
lib.mystuff {
userFunc =user_myclassname->main
var_to_pass_at_class=test
}
--
Now you can replace the subpart with dynamic content (depends on your TYPO3 configuration)
+- page.10.subparts.CONTENT<lib.mystuff
--
File: my_user_class.php
<?php
class user_myclassname {
function main($content,$conf){
global $TSFE;
return $conf['var_to_pass_at_class']; //returns test
}
}
What are some popular ways (and their caveats) of handling dependency path changes in scripted languages that will need to occur when deploying to a different directory structure?
Let the build tool do a textual replace? (such as an Ant replace?)
Say for example the src path in a HTML tag would need to change, maybe also a AJAX path in a javascript file and an include in a PHP file.
Update
I've pretty much sorted out what I need.
The only problem left is the URL that gets posted to via AJAX. At the moment this URL is in a JS config file amongst many other parameters. It is however the only parameter that changes between development, QA and production.
Unfortunately dynamically generated URLs as #prodigitalson suggested aren't desirable here--I have to support multiple server side technologies and it would get messy.
At the moment I'm leaning towards putting the URL parameter into its own JS file, deploying a different version of it for each of development, QA and production, additionally concatenating to the main config file when deployed.
IMO if you need to do this then youe developed in the wrong way. All of this shoul dbe managed in configuration file(s). On th ephp side you should have some kin dof helper that ouputs the path based on the config value... for example:
<?php echo image_tag('myimage.jpg', array('alt'=>'My Image')); ?>
<?php echo echo javascript_include('myscript.js'); ?>
In both these cases the function would look up the path to the javascript and image directories based on deployment.
For links you should be bale to generate a link based on the local install of the application and a set of parameters like:
<?php echo link_to('/user/profile', array('user_id' => 7)); // output a tag ?>
<?php echo url('/user/profile', array('user_id'=>7)); // jsut get the url ?>
As far as javascript goes you shouldnt have any paths hardcoded in a js file that need to be changed. You should make your ajax or things that are path dependent accept parameters and then you send these parameters from the view where you have the ability to use the same scripted configuration.. so oyu might have something like:
<script type="text/javascript">
siteNamespace.callAjax(
'<?php echo url('/user/profile/like', array('user_id' => 7)); ?>',
{'other': 'option'}
);
</script>
This way you can change all this in a central location based on any number of variables. Most MVC frameworks are going to do something like this though the code will look a bit different and the configuration options will vary.
I would take a look at Zend Framework MVC - specifcally the Config, Router, and View Helpers, or Symfony 1.4 and its Config, Routing and Asset and Url Helpers for example implementations.