If we have only changed assets in the www/ folder of our cordova project, and have not altered any of the native code/plugins, shouldn't it be possible to have a script that just replaces the new www/ folder with the existing one in the ios build output?
That way we don't have to re-build the entire ios project using cordova build ios every time we want to make a small change and re-run in the simulator. This would save us a nice chunk of time daily.
Does anything like this exist already?
You have three ways to archive this:
Make absolute symlinks for every file or folder from your root-www-folder to your platform-www-folder. BUT don't symlink the whole www-folder and don't symlink the cordova.js file.
In Xcode -> Build Phases you can put copy-shell-scripts in Copy www directory for every file or folder of your www-folder. It should look like:
cp -R /absolute/path/to/your/app/www/index.html /absolute/path/to/your/app/platforms/ios/www/index.html
You can use a hook. Put the following hook in hooks->after_platform_add->create_symlinks.js and in hooks->after_build->create_symlinks.js. Everytime you add a android or ios platform or build the application the hook will run.
You have to make the script executable and maybe you need to install shelljs from npm.
Here is my hook, modify it to your needs:
#!/usr/bin/env node
var what_to_symlink_from_www = [
"assets",
"index.html"
];
// no need to change below
var path = require("path"),
fs = require("fs"),
shell = require("shelljs"),
rootdir = process.argv[2],
added_platform = process.env.CORDOVA_PLATFORMS,
www = rootdir + "/www/",
android_www = rootdir + "/platforms/android/assets/www/",
ios_www = rootdir + "/platforms/ios/www/",
buildnumber_file = rootdir + "/buildnumber",
buildnumber,
active_platform_www;
shell.echo("\r\nHook start: Symlinking");
if (added_platform === "ios") {
active_platform_www = ios_www;
do_job()
}
else if (added_platform === "android") {
active_platform_www = android_www;
do_job()
}
function do_job() {
what_to_symlink_from_www.forEach(function (item) {
shell.rm("-rf", active_platform_www + item);
shell.ln("-s", www + item, active_platform_www + item);
shell.echo("symlinked: " + item + " to " + active_platform_www);
});
shell.echo("Hook end: Symlinking" + "\r\n");
}
You can just run
cordova prepare
https://cordova.apache.org/docs/en/latest/reference/cordova-cli/#www
Related
Given an application made in electron. The folder structure would look something like:
App
- assets
-models
- exe files
index.html
main.js
When executing the build following the recommendation of the site by entering the following command:
electron-packager . --overwrite --asar=true --platform=win32 --arch=ia32 --icon=assets/icons/win/icon.ico --prune=true --out=release-builds --version-string.CompanyName=CE --version-string.FileDescription=CE --version-string.ProductName="Electron Tutorial App"
The electron v.1.7.9 creates the build correctly, however it inside the release-builds / resources folder the app.asar file, so all the content that was inside my models folder becomes inaccessible. Inside this folder were .exe files that should be run on demand.
The system then looks for the files in the following url: parth_do_projeto / resources / app.asar / assets / models /, that is, it considers that the app.assar is a folder, but after the app.asar build is a file.
Since there were .exe files inside the original folder, the app.asar can not absorb executables.
What would be the way I keep these .exe files? If you build the build without the --asar parameter, the program works correctly, enter, all my project folder / source code is exposed.
My question is what is the best way to generate the build, keeping the code closed and making use of .exe files?
The short answer to your question is to use the unpackDir option for the asar option inside of electron-packager. Here is a sample of what this might look like:
'use strict';
... ...
var packager = require('electron-packager');
var electronPackage = require('electron/package.json');
var pkg = require('./package.json');
// pull the electron version from the package.json file
var electronVersion = electronPackage.version;
... ...
var opts = {
name: pkg.name,
platform: 'win32',
arch: 'ia32', // ia32, x64 or all
dir: './', // source location of app
out: './edist/', // destination location for app os/native binaries
ignore: config.electronignore, // don't include these directories in the electron app build
icon: config.icon,
asar: {unpackDir: config.excludeFromASAR}, // compress project/modules into an asar blob excluding some things.
overwrite: true,
prune: true,
electronVersion: electronVersion , // Tell the packager what version of electron to build with
appCopyright: pkg.copyright, // copyright info
appVersion: pkg.version, // The version of the application we are building
win32metadata: { // Windows Only config data
CompanyName: pkg.authors,
ProductName: pkg.name,
FileDescription: pkg.description,
OriginalFilename: pkg.name + '.exe'
}
};
// Build the electron app
gulp.task('build:electron', function (cb) {
console.log('Launching task to package binaries for ' + opts.name + ' v' + opts['appVersion']);
packager(opts, function (err, appPath) {
console.log(' <- packagerDone() ' + err + ' ' + appPath);
console.log(' all done!');
cb();
});
});
Using the electron-boilerplate to create an .exe for windows, it needs to run a .bat file. However, using npm start it works but when it gets packaged with npm run release, it doesn't run the .bat
This is my code for the function
const spawn = require('child_process').spawn;
const bat = spawn('cmd.exe', ['/c', 'Install.bat']);
bat.stdout.on('data', (data) => {
var str = String.fromCharCode.apply(null, data);
addLog(data);
console.info(str);
});
bat.stderr.on('data', (data) => {
var str = String.fromCharCode.apply(null, data);
addLog(data,"error");
console.error(str);
});
bat.on('exit', (code) => {
console.log(`Exit ${code}`);
});
Already checked for child-process
When you run electron via npm start it will typically set the current working directory to the folder for the app (containing your package.json). So it will look for cmd.exe in that folder.
After you build the app and run it, the current working directory might be somewhere else, for example C:\\ (on Windows). You can find the current working directory with process.cwd().
To find the app folder regardless of how the app is running, Electron provides electron.app.getAppPath().
So you can use it like this:
const path = require('path');
const cmdPath = path.join(electron.app.getAppPath(),'cmd.exe');
const bat = spawn(cmdPath, ['/c', 'Install.bat']);
I want environmental exclusive configs.
I see process.env is referred to often, but I have not seen it documented anywhere where these values should be but.
I saw a .env file in my project folder and I tried putting a value there
foo=bar
right under
cloudinary_url=...
However upon calling process.env.foo in code, I don't get anything.
How should this be done?
You are correct. The .env file is in your project folder. Did you require it in your keystone.js file?
At the top of your keystone.js file should be:
require('dotenv').load();
Also, be sure your starting directory is the same where the keystone.js file is. If you are starting KeystoneJS like this:
node ./your-project/keystone.js
You should take care about NodeJS directory change. Try to put this at the top of your keystone.js file:
console.log('Starting environment: ' + process.env.NODE_ENV);
if (process.env.HOME && process.env.NODE_ENV == 'production') {
console.log('Starting directory: ' + process.cwd());
try {
process.chdir(process.env.HOME);
console.log('New directory: ' + process.cwd());
}
catch (err) {
console.log('chdir: ' + err);
}
}
require('dotenv').load();
I'm trying to create an easy workflow for package development and was hoping someone could pint me in the right direction. In short, once a css file has been updated I want to be able to run a command (php artisan vendor:publish --force) to automatically publish the files.
Can this be done with Elixir and if so could anyone point me in the right direction?
regards
This was incredibly useful to get me on the right track, but I found a slightly simpler solution that I thought I would share:
var elixir = require('laravel-elixir');
var gulp = require("gulp");
var shell = require("gulp-shell");
elixir(function(mix) {
mix.task('publish_assets', ['resources/assets/**/*.scss', 'resources/assets/**/*.js']);
});
gulp.task('publish_assets', shell.task([
"php ../../../../artisan vendor:publish --tag=public --force"
]));
It watches all of the js and sass files for changes and runs the publish assets task. Mine is set to only publish the "public" tagged files, and a quick note as well, you will need to install the gulp-shell utility (https://www.npmjs.com/package/gulp-shell) for either of these.
if anyone is looking, this works nicely:
var gulp = require("gulp");
var shell = require("gulp-shell");
var elixir = require("laravel-elixir");
elixir.extend("publish", function() {
var baseDir = this.assetsDir;
gulp.task("publish_assets", function() {
gulp.src("").pipe( shell( [
"php ../../../artisan vendor:publish --force",
"cd ../../../ ; gulp"
]));
});
this.registerWatcher("publish_assets", [
baseDir + '**/*.scss',
baseDir + '**/*.js'
]);
return this.queueTask("publish_assets");
});
What is the best strategy to deploy a Dart Web-ui app manually ?
pub deploy doesn't work for me and I have raised bug report. So am thinking what is the best way to manually deploy.
This is how I started:
1) From project root I compile the webui components (dwc.dart)
2) change directory to web/out then run dart2js
3) copy all .js files into that scripts/js public folder on server
4) copy appname.html to server changing css and script paths to option 3
5) Make sure dart.js is also in the same directory as item 3
this is as far as I got. So what else do I need to do ?
A few questions:
1) Do I manually change the file paths in the generated .js files to point to public folders on server for the files they are referencing and make sure those files are on server also ?
2) Do I need to copy all packages to server also ?
3) Any preferred file structure on server?
Any tips on this really appreciated.
Thanks.
I wrote a Grunt script for it (since I had no time to look up how to properly write code for Grunt, I did not share the code since it's a mess) but I basically do this:
compiling a list of files with dwc to a given out dir
compile it to javascript
clean up all non-deployable files
change some paths inside the HTML to match the server paths (for some reasons, this gets changed by the compilation process)
remove all packages except the ones I really need (JS interopt and browser)
Since I'm only using the JS version, I remove all dart packages. Since the paths inside the HTML files are up to you, you can already use a structure that suits you/your server.
I can provide you with a Grunt script to understand the order of tasks. Practically the order I use is this one:
Create the build directory. I usually use /build/web. I usually create these files (index.html, main.dart, /css and so on into the /web dir). I create the rest of components into /lib directory.
Compile the .dart file that contains the main() function ("main.dart" in my case for simpler projects) file to Javascript and put it into /build/web directory
Copy the other needed files and folders to the /build/web directory. Also, during this process you'll be copying the packages that your project needs. You'll see in the example provided below.
Remove all empty folders from the project
You can create a Grunt task to open the /index.html file in the browser once the building process has ended (I will not provide this example)
The structure of the dart test project:
testApp
- gruntfile.js
- package.js
/lib
/packages
/angular
/web
- index.html
- main.dart
/css
/img
So, the Grunt example script to cover steps from 1 - 4 looks like this (copy it to gruntfile.js):
module.exports = function (grunt) {
grunt.initConfig({
// 1.
// create build web directory
mkdir: {
build: {
options: {
create: ['build/web']
}
}
},
// 2.
// compile dart files
dart2js: {
options: {
// use this to fix a problem into dart2js node module. The module calls dart2js not dart2js.bat.
// this is needed for Windows. So use the path to your dart2js.bat file
"dart2js_bin": "C:/dart/dart-sdk/bin/dart2js.bat"
},
compile: {
files: {'build/web/main.dart.js': 'web/main.dart'}
}
},
// 3.
// copy all needed files, including all needed packages
// except the .dart files.
copy: {
build: {
files: [
{
expand: true,
src: [
'web/!(*.dart)',
'web/css/*.css',
'web/res/*.svg',
'web/packages/angular/**/!(*.dart)',
'web/packages/browser/**/!(*.dart)'
],
dest: 'build'
}
]
}
},
// 4.
// remove empty directories copied using the previous task
cleanempty: {
build: {
options: {
files: false
},
src: ['build/web/packages/**/*']
}
},
});
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
grunt.registerTask('default', [
'mkdir:build',
'dart2js',
'copy:build',
'cleanempty:build'
]);
};
So this is the Grunt script example.
Create a /gruntfile.js file into your project's root directory and copy/paste the script to it.
Create a /package.json file into your project's root directory and copy/paste the following script:
{
"name": "testApp",
"version": "0.0.1",
"description": "SomeDescriptionForTheTestApp",
"main": "",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "YourName",
"peerDependencies": {
"grunt-cli": "^0.1.13"
},
"devDependencies": {
"grunt": "^0.4.5",
"grunt-cleanempty": "^1.0.3",
"grunt-contrib-copy": "^0.7.0",
"grunt-dart2js": "0.0.5",
"grunt-mkdir": "^0.1.2",
"matchdep": "^0.3.0"
}
}
Open Command Prompt in Windows, Terminal in Linux, navigate to your project's root directory and use this command:
npm install
Wait untill all Grunt modules needed will be downloaded to your local project. Once this is finished, issue this command in Command Prompt or Terminal:
node -e "require('grunt').cli()"
You can use this to initiate Grunt default task without having Grunt installed globally on your system.
Now, to know the exact build structure for your project (including the packages that the project needs), make a build using Pub Build. Then you will be able to instruct Grunt to create the same dir structure.
You can add other tasks (like minification) if you want.
Hope this will help you all to understand the process and get you started with a test app first. Add your comments to make this even better and simplify it even more.