Using Pica.js or any npm installed JS module in a Wordpress plugin?
So I'm just looking for general direction on where to start. I have a Wordpress plugin I'm developing and would like to use the Pica.js image resizing library. However I'm not sure where to start in integrating the library into my plugin. I'm very familiar with NPM modules from my work in Vue.js with webpack and so on. Of course I tried to do the standard wp_enqueue of the script and it just doesn't find the library.
Normally I would install the module using npm then import it into my Vue app inside of the App.js file. Then off I go. But in Wordpress I understand how to enqueue JS scripts but not sure exactly how to begin with loading JS modules via npm. I've read about how to integrate NPM with the Wordpress, but most of the articles I've read talk about using npm to help with automating some aspects of installing Wordpress.
However none of them specifically talk about integrating a JS module, especially in a plugin.
Do I just npm install Pica into my WP plugin directory and enqueue the js file? If so I can handle that. I'm not looking for someone to teach me how to do it, just the direction to where to look and I can take it from there. I was hoping to have someone familiar with what I'm attempting to do say "YES" that's the direction to take, or if not do it a different way. Before I spend hours going down the wrong rabbit hole. Any recommendations would be greatly appreciated.
wordpress npm
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
add a comment |
So I'm just looking for general direction on where to start. I have a Wordpress plugin I'm developing and would like to use the Pica.js image resizing library. However I'm not sure where to start in integrating the library into my plugin. I'm very familiar with NPM modules from my work in Vue.js with webpack and so on. Of course I tried to do the standard wp_enqueue of the script and it just doesn't find the library.
Normally I would install the module using npm then import it into my Vue app inside of the App.js file. Then off I go. But in Wordpress I understand how to enqueue JS scripts but not sure exactly how to begin with loading JS modules via npm. I've read about how to integrate NPM with the Wordpress, but most of the articles I've read talk about using npm to help with automating some aspects of installing Wordpress.
However none of them specifically talk about integrating a JS module, especially in a plugin.
Do I just npm install Pica into my WP plugin directory and enqueue the js file? If so I can handle that. I'm not looking for someone to teach me how to do it, just the direction to where to look and I can take it from there. I was hoping to have someone familiar with what I'm attempting to do say "YES" that's the direction to take, or if not do it a different way. Before I spend hours going down the wrong rabbit hole. Any recommendations would be greatly appreciated.
wordpress npm
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
add a comment |
So I'm just looking for general direction on where to start. I have a Wordpress plugin I'm developing and would like to use the Pica.js image resizing library. However I'm not sure where to start in integrating the library into my plugin. I'm very familiar with NPM modules from my work in Vue.js with webpack and so on. Of course I tried to do the standard wp_enqueue of the script and it just doesn't find the library.
Normally I would install the module using npm then import it into my Vue app inside of the App.js file. Then off I go. But in Wordpress I understand how to enqueue JS scripts but not sure exactly how to begin with loading JS modules via npm. I've read about how to integrate NPM with the Wordpress, but most of the articles I've read talk about using npm to help with automating some aspects of installing Wordpress.
However none of them specifically talk about integrating a JS module, especially in a plugin.
Do I just npm install Pica into my WP plugin directory and enqueue the js file? If so I can handle that. I'm not looking for someone to teach me how to do it, just the direction to where to look and I can take it from there. I was hoping to have someone familiar with what I'm attempting to do say "YES" that's the direction to take, or if not do it a different way. Before I spend hours going down the wrong rabbit hole. Any recommendations would be greatly appreciated.
wordpress npm
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
So I'm just looking for general direction on where to start. I have a Wordpress plugin I'm developing and would like to use the Pica.js image resizing library. However I'm not sure where to start in integrating the library into my plugin. I'm very familiar with NPM modules from my work in Vue.js with webpack and so on. Of course I tried to do the standard wp_enqueue of the script and it just doesn't find the library.
Normally I would install the module using npm then import it into my Vue app inside of the App.js file. Then off I go. But in Wordpress I understand how to enqueue JS scripts but not sure exactly how to begin with loading JS modules via npm. I've read about how to integrate NPM with the Wordpress, but most of the articles I've read talk about using npm to help with automating some aspects of installing Wordpress.
However none of them specifically talk about integrating a JS module, especially in a plugin.
Do I just npm install Pica into my WP plugin directory and enqueue the js file? If so I can handle that. I'm not looking for someone to teach me how to do it, just the direction to where to look and I can take it from there. I was hoping to have someone familiar with what I'm attempting to do say "YES" that's the direction to take, or if not do it a different way. Before I spend hours going down the wrong rabbit hole. Any recommendations would be greatly appreciated.
wordpress npm
wordpress npm
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
asked Nov 25 '18 at 17:31
user1110938user1110938
63310
63310
add a comment |
add a comment |
0
active
oldest
votes
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53470060%2fusing-pica-js-or-any-npm-installed-js-module-in-a-wordpress-plugin%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
0
active
oldest
votes
0
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53470060%2fusing-pica-js-or-any-npm-installed-js-module-in-a-wordpress-plugin%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
