I'm trying to figure out how to reconcile some Cordova + git "best practices" with what I think is reality, and I'm hoping someone can shed some light on this for me.
If I understand correctly, the current "best practice" is to add these directories to my .gitignore (from the book "Developing with Cordova CLI", the current version):
platforms/
plugins/
node_modules/
This removes the easily downloadable plugins and mostly boilerplate platform code from version control because it can be easily generated with a simple Cordova CLI command.
But, this seems counter-intuitive because - and I'm thinking like NPM or Bower - with the Cordova CLI I can't save which platforms and plugins I'm using in a config file. With NPM, I can add a --save switch to save the package in the package.json file. This allows me to not version control my node_modules folder and instead use 'npm install'. With the Cordova CLI I can't seem to use the --save switch (is there an equivalent) to 'remember' the plugins or platforms I intend to use.
It seems that the config.xml file in the www/ directory doesn't save which platforms or plugins have been added.
Is there some other file in the project that keeps a memory of which platforms and plugins I want to use? How does it work?
Cordova 4.3.0 + allows you to save and restore platforms and plugins. Saved information is stored in config.xml file. See v5.0.0 release notes and the official Cordova docs.
You can save platforms and plugins using the --save option when you add them:
cordova platforms add PLATFORM --save
cordova plugins add PLUGIN --save
Or you can save platforms and plugins that are currently added:
cordova platforms save
cordova plugins save
By doing this there is no need to check in platforms or plugins into your code repository. They will be automatically restored based on your config.xml file when cordova prepare command is run.
I typically write a hook to capture the plugins I want to use in my project. You can see this in an article I wrote here: http://devgirl.org/2013/11/12/three-hooks-your-cordovaphonegap-project-needs/
With the new modular architecture of Cordova 3.x, every app needs plugins, even to use basic functionality such as logging or geolocation. Rather than document which plugins/features your project needs and ask each new developer to install them, download and install them automatically with a hook in the after_platform_add step. Using this plugin, every time a developer checks out the project and adds a platform, they automatically have the required plugins.
You also may be interested in following along with this bug, which suggests npm style --save functionality: https://issues.apache.org/jira/browse/CB-5775
Platforms are a little more difficult because they don't fit into the hook architecture, but you could write a shell script which you could execute to add your platforms.
#!/bin/sh
for plat in ios android; do
cordova platform add $plat
done
You could do something similar with the version of cordova you have installed in node_modules (at least that is what I think you are installing in node_modules)--have shell script to get the correct version of cordova:
#!/bin/sh
VERSION=3.3.1-0.4.2
npm install cordova#$VERSION
PS Glad you liked the book!
Related
It may be a dumb question but I feel that I'm floundering around attempting to edit the wordpress plugin that I downloaded from github repo: https://github.com/WordPress/gutenberg-examples.
Right now, I'm following the block tutorial from https://developer.wordpress.org/block-editor/how-to-guides/block-tutorial/.
So what I did:
download the pre-built plugin in zip folder
upload it to wordpress site that I created in docker (https://developer.yoast.com/blog/set-up-wordpress-development-environment-in-docker/)
open the zip folder and move it to my plugins directory
open, for example, "01-basic-esnext" folder inside the gutenberg-examples folder and edit in block.build.js. The changes I made would be shown in the block editor in the wordpress post that I created.
However, what I'm confused about is the npm stuff that's mentioned in "Development" section.
For each of the examples that include an esnext example the following
commands are required to build the plugins:
To install the node packages
npm install
To build the production version of the plugin
npm run build
To build a development version, change to the local
directory of the block you are working on, and run npm start to watch
for changes and automatically rebuild as you develop.
cd 01-basic-esnext/
npm start
Before that, the "Development" section already mentioned building a docker/wordpress environment for the plugin right inside the gutenberg-examples folder.
However, the way I set up my stuff is different. I already have a docker running in my wordpress folder like what I followed in https://developer.yoast.com/blog/set-up-wordpress-development-environment-in-docker/ and this plugin is already in my plugins directory. I can easily edit the files in visual studio code and see the changes in my local wordpress site.
So should I be doing something to install the npm stuff or leave it alone?
npm is used for these WordPress plugins because the -esnext versions of the examples get built from Javascript modules. The build process runs on npm and nodejs. That means, if you work on that -esnext code, that you're living in a hybrid world -- you have php and apache running your development web server, and you have nodejs and npm handling your builds.
The WordPress team carefully rigged a docker setup to support the process of edit / run for you. So if you use your own docker setup, you won't get the benefit of theirs.
When you have finished your development effort, you can use npm run build to build a .zip file which you can then install in your own WordPress instances using the Upload Plugin button at the top of the Add Plugins page.
Code is poetry, for sure. But development environments are not.
I am trying to use CKEditor for strapi project, but failing to integrate.
What I did so far:
strapi new cms --quickstart It is starting me new cms application.
npm install ckeditor
Edit the code located at ./plugins/content-manager/admin/src/component/Edit/index.js to CKEditor implementation
npm run build to see my changes, tried npm run setup too
But here I'm getting error webpackJsonp is not defined
I'm not providing the code how I modified, because, build command is not reaching till there.
I appreciate any help you can provide
In order to change the default WYSIWYG in Strapi you will need to
Fork the repository check out the CONTRIBUTING GUIDE
Once you have the development setup you can directly modify the code in packages/strapi-plugin-content-manager/admin/src/components/WYSIWYGWithErrors and its related children. Install the dependency in strapi-admin
Uninstall the content manager plugin (again make sure you are running the latest version of Strapi
Copy the strapi-plugin-content-manager package inside your app's plugin folder (rename it content-manager)
Copy the following file in my-app/admin/src/plugins.js and change the paths of the plugins so it matches your new one
run yarn develop
I have a pretty common (i guess) problem. Many of my projects utilize nodejs, some for business logic, others only for some building task.
I need to have different runtimes in different projects, one of my electron apps requires node 7.10.0, a typical build suite requires node 8.x.
Now i know - i can use sudo n 7.10.0 or sudo n latest to switch the runtime globally on my computer (For those, who dont know this - have a look at "n")
Anyway, IMO this is not so convenient (some times, i need to rebuild all the modules after switching versions, often i forget to switch and so on). Is there a way of telling node which interpreter to use? Can i use a .npmrc file in a project directory to force a specific nodejs version within that subdirectory?
I searched exactly for this (npmrc node version) but was not lucky enough to find something.
Okay, i found a similar quesion:
Automatically switch to correct version of Node based on project
it seems you can install "avn" and use a .node-version file to do exactly that.
sudo npm install -g avn avn-n
avn setup
then you can create a .node-version file in your project and enter the desired version
echo 7.10.0 > .node-version
Then avn will detect that and activate the correct version
Unfortunately i get an additional permissions error. So to make this work, you need to install/configure "n" to work without sudo/root.
If you're fine with using another tool you could use nvshim.
pip install nvshim # this is all you need to do
It does not slow your shell startup or switching directories, instead moving the lookup of which node version to when you call node, npm or npx by shimming those binaries. More details in the docs.
Source, I wrote the tool.
NVM (Node Version Manager) allow us to use different versions of node quite easily on a single machine. You can have a look at here how to configure and use it.
Volta can used to manage multiple nodejs, npm or yarn versions on different projects on same machine. It's cross-platform.
For example you can run volta pin node#14 in project directory and this will set node to v14 if it exists otherwise it will download and then set it.
More information here https://docs.volta.sh/guide/
I'm grappling with the HTML5 + JS path for writing photoshop extensions, and I'd like to use Coffee instead of plain JS.
However the node install included with Photoshop appears to be version 0.10.30 and does not seem to include npm. Is there a way to install npm into the photoshop version of node? Or would it be save to replace that version with one which includes npm? As a last resort I can probably install another node with npm, and coffee, then copy the js into the plugins -- but that seems very awkward.
Has anybody tried this already and cracked it?
You can use a separate directory for development and a task runner like Grunt to compile your sources into the plugins directory whenever there are changes.
Take a look at some boilerplates to get you started quickly, like grunt-html5-boilerplate or vtex/speed
I know when I install a cordova plugin the native files are copied into the platform folder and will be compiled when I build that platform. But is it possible to execute an script to for example download additional binary files, or build custom frameworks?
What I am looking for is a way to specify in plugin.xml to execute a particular shell script or install an npm module when the plugin is first installed into a Cordova project. Is this possible?
That is not possible using the 'cordova plugin add' command (not what they were designed to do) but definitely possible if you use task manager tools like Grunt to automate your process.
You can combine tasks to run in order, such as running your own shell scripts before/after you make a call to install plugins.
Check out npm grunt for more info.
Yes, you can
check this:
https://cordova.apache.org/docs/en/latest/guide/appdev/hooks/index.html
You only have to make a folder, called "after_plugin_add", inside the hooks folder of the project, and add there your script.