Dear community and WIX developers,
Although the WIX Code editor is a fine product, many will agree that nothing beats your own set-up. Having the code on your local machine brings practical advantages such as (git) version control and unit tests. These become a must for bigger projects, in my opinion.
Right now, I am developing in WebStorm and when I want to try out or publish the changes, I have to manually copy over the code, file for file. Does anybody from the community or maybe a WIX developer have a better (automated) solution for this? In general, can you share your favourite WIX Code development environment tips and tricks?
PS: For those interested, my current set-up allows me to run automated unit tests with Mocha in WebStorm. If anyone else wants to do this, they will probably run into the same problem I did, which is handling the wix-*
dependencies such as wix-users
, wix-fetch
, etc… We need to mock these somehow.
To do this, add a mocks
folder to your project root and for each dependency (say wix-fetch
) that you use, add a folder with a package.json
file and an index.js
file:
// ./mocks/wix-fetch/package.json
{
"name": "wix-fetch",
"version": "0.0.1",
"dependencies": {
}
}
// ./mocks/wix-fetch/index.js
module.exports = {fetch: require('node-fetch')};
In your root package.json, add this local dependency:
// ./package.json
// ...
"dependencies": {
"node-fetch": "^2.1.1",
"wix-fetch": "file:./mocks/wix-fetch"
},
// ...
In this case, we are lucky and there is a substitute for wix-fetch
(namely node-fetch
) and the functionality will be the same! But usually, as is more traditional with mocks, you could return static dummy data as well, or whatever the unit test needs. I hope this will be of help to anybody out there.