I have installed electron and electron-packager, all of them in global mode. When I build my app electron-packager searchs the local electron module. How forcing electron-packager to use the global electron module that I have installed?
The short answer is that what you have described isn't the way you "should" use electron-packager. Normally, the intent is that you are building a local package (exe or such) under the project directory you are working on. For example, an electron/angular project building on a Windows platform might have the following kind of structure:
C:.
+---ClientSide
¦ +---index.html
¦ +---app
¦ ¦ +---app.component.ts
¦ ¦ +---app.module.ts
¦ ¦ +---main.ts
¦ ¦ +---AppContent/
¦ ¦ +---help/
¦ +---Styles
¦ +---test
¦ +---AppContent/
+---dist/
+---edist
| \---Application-win32-ia32 [*location of binary source for the install]
+---Installer
+---Application/
gulpfile.js
karma.conf.js
main.js
package.json
README.md
webpack.config.js
In this kind of scenario, the package.json file typically contains reference to both packages, as in:
.. .. ..
"devDependencies": {
"#angular/animations": "4.4.4",
"#angular/common": "4.4.4",
"#angular/compiler": "4.4.4",
.. .. ..
.. .. ..
"electron": "1.7.9",
"electron-packager": "9.1.0",
.. .. ..
Then within your local gulpfile.js you would typically include a call to run the packager that refers to the local version of electron. Something 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.electroncompiled}, // compress project/modules into an asar blob but don't use asar to pack the native compiled modules
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();
});
});
If you don't want to build the same version of electron that as is present locally, you can change that parameter to whatever version of electron you'd like packager to use. As in, replacing this line of code:
// pull the electron version from the package.json file
var electronVersion = electronPackage.version;
With something like this:
// Use a specific electron version
var electronVersion = '1.7.8';
If you are going to run electron-packager from the command line, you have all the same options available as I've shown here in the API options. You can see the full list of options in their online github user docs . In your case, if you are using command line then use the "--electron-version" switch to set the electron version you wish.
Related
I need to exclude only the "package.json" from the root folder
but at the moment all "package.json" files are unpacked (from node_modules ...)
Electron v18
Electron Package v15.4.0
Windows
script in package.json
"scripts": {
"package": "electron-packager . TestApp --out=dist/win --asar.unpack=\"{*/jar/**/*,**/jre/**/*,package.json}\"
}
and with this pattern, no file will be unpacked
/package.json => NOK
/{,!(node_modules)/**/}package.json => NOK
any ideas??
Greetings
Klaus
I've been working on a small project trying to teach myself how to use Bazel. The goal is to download a http_archive that contains a python interpreter. once the python interpreter has been added to the environment I want to run the command `python.exe --version and write the output of that into a file
The issue I have the most difficulty with at the moment are the following:
I am not confident that I am correctly injecting the hermetic python BUILD file into the hermetic python package (I keep getting the message "BUILD file not found in any of the following directories. Add a BUILD file to a directory to mark it as a package").
I'm pretty sure that when I pass in python_compiler = ["#hermetic_python"] in the BUILD file I'm just getting a string and not a reference to the files in the package
Here is an overview of my project and the code files. Any help would be appreciated! :D
Project structure:
|-- WORKSPACE
|-- BUILD
|-- custom_rules.bzl
|-- main.py
|-- custom-rules/
|-- BUILD.custom_python
|-- custom_python_rules.bzl
WORKSPACE
load("#bazel_tools//tools/build_defs/repo:http.bzl", "http_archive")
http_archive(
name = "hermetic_python",
urls = ["https://www.python.org/ftp/python/3.9.10/python-3.9.10-embed-amd64.zip"],
sha256 = "67161cab713a52f6658b76274f8dbe0cd2f256aab1e84f94cd557d4a906fa5d2",
build_file = "#//:custom-rules/BUILD.custom_python"
)
BUILD File:
load("//:custom_rules.bzl","build_with_custom_python")
build_with_custom_python(
name = "write-to-file",
python_compiler = ["#hermetic_python"]
)
custom_rules.bzl
def _build_with_custom_python_impl(ctx):
out_file = ctx.actions.declare_file("file_with_python_version.txt")
ctx.actions.run(
outputs = [out_file]
executable = ctx.attr.python_compiler,
arguments = [--version],
)
return DefaultInfo(files=[out_file])
build_with_custom_python = rule(
implementation = _build_with_custom_python_impl,
attrs = {
"python_compiler": attr.label_list(allow_files=True)
}
)
BUILD.custom_python
load("//:custom_python_rules.bzl","run_me")
run_me(
name="my_py_run",
python_files = glob(["**"]),
visibility = ["//visibility:public"],
)
custom_python_rules.bzl
def _run_me_impl(ctx):
pass
run_me = rule (
implementation = _run_me_impl,
attrs = {
"python_files" : attr.label_list(allow_files=True),
}
)
I've spent some more time on this I've managed to mostly do what I intended to do. Here is an overview of what I've learned that fixes the problems in the original question
1 - Mark the custom build file / custom rule folder as a package
Just by adding an empty BUILD file into the custom-rules folder I had market it as a bazel package. That allowed me to reference the files
|-- WORKSPACE
|-- BUILD
|-- custom_rules.bzl
|-- main.py
|-- custom-rules/
|-- BUILD # NEW
|-- BUILD.custom_python
|-- custom_python_rules.bzl
2 - The workspace file references a BUILD file. That build file needs to reference a custom rules file
The workspace should just reference the build file directly // means workspace root and then its just the path to the BUILD file
http_archive(
# build_file = "#//:custom-rules/BUILD.custom_python" // WRONG
build_file = "//custom-rules/BUILD.custom_python" // RIGHT
)
3 - BUILD file can not reference the custom rules (bzl file)
This is the one that took the longest time for me to figure out! The BUILD file that is loaded into the package (hermetic_python from the workspace file) NEEDS TO reference the current workspace in order to
# BUILD.custom_python
load("#root_workspace//custom-rules:custom-python-rules.bzl","execute_python_file")
Notice that this starts with #root_workspace which tells the BUILD file to look in that workspace. the WORKSPACE file in the project now contains this line
# WORKSPACE
workspace(name = "root_workspace")
4 - Passing in a build step as the dependancy
build_with_custom_python(
name = "write-to-file",
# python_compiler = ["#hermetic_python"] WRONG
python_compiler = ["#hermetic_python:my_py_run"] RIGHT
)
The key here is that I need to reference a build action which then makes the files in that build action available through the dependency. In this case #hermetic_python is the package and :my_py_run is the build action.
I still need to figure out how to properly use the files in the dependency but that's outside of the scope of this question
Following react-native document to integrate react-native to existing IOs app. The structure of directory as document to integrate is
android/
ios/
Podfile
#...other ios file
node_modules/
react-native
react
#react-native-community
package.json
....
So that when run pod install from Podfile can call function use_native_modules
require_relative './libs/react-native-libs/node_modules/#react-native-community/cli-platform-ios/native_modules'
...
use_native_modules!
But I want to organize the project different due to not change my existing project structure,
so I add react-native-integrate module like as a part of my IOs project like this
my_ios_project
Podfile
libs/
... other modules
react-native-integrate
node_modules
react-native
#react-native-community
react
package.json
And then I change the path of relative-module:
require_relative './libs/react-native-libs/node_modules/#react-native-community/cli-platform-ios/native_modules'
...
use_native_module!
But the problem is in native_modules files and others libraries in node_modules use absolute require. For example in #react-community/cli-platform-ios/native_module.rb there is a line such as
cli_resolve_script = "try {console.log(require('#react-native-community/cli').bin);} catch (e) {console.log(require('#react-native/cli'))}"
that require absolute path '#react-native-community'. So that when I run Pod install my pod file from parent directory the node can not recognize my children module so that it cause error.
As I know the node_module 'spaths list is basically a list of node_modules directories under every directory from the current directory to the root directory. And the current directory is that the directory of the Podfile that call require 'native_module.rb'
Could you please give me a solution solve this problem like add node path from children directory or something else ? Thank you.
I found a solution:
add package.json file at root ios with property main
add react-native.config.js at root ios project, edit path to cli-platform-ios and cli-platform-android:
'use strict';
const ios = require('./node_modules/#react-native-community/cli-platform-ios');
const android = require('./node_modules/#react-native-community/cli-platform-android');
module.exports = {
commands: [...ios.commands, ...android.commands],
platforms: {
ios: {
linkConfig: ios.linkConfig,
projectConfig: ios.projectConfig,
dependencyConfig: ios.dependencyConfig,
},
android: {
linkConfig: android.linkConfig,
projectConfig: android.projectConfig,
dependencyConfig: android.dependencyConfig,
},
}
};
Run pod install again
Checkout my demo here:
https://github.com/lehoangnam97/demo-intergrate-rn-on-ios
Problem and question
I've always had problems with CSS code, so now I always use SaSS code. But my question is: how can I use SaSS for an ASP.NET MVC application?
I've tried
I've tried tried to use a Gulp task for this. I've used these commands
npm init
npm install --save gulp
npm install --save gulp-sass
Here is my package.json file:
{
"name": "markeonline",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Hein Pauwelyn",
"license": "ISC",
"dependencies": {
"gulp": "^3.9.1",
"gulp-sass": "^3.1.0"
}
}
Here is the gulpfile.js
var gulp = require("gulp"),
sass = require("gulp-sass");
// other content removed
gulp.task("sass", function () {
return gulp.src('./**/*.scss')
.pipe(sass())
.pipe(gulp.dest(project.webroot + './MarkeOnline.Website/Content/css'));
});
Here is my project structure:
This code gives me the following error if I use the command below:
gulp sass
ReferenceError: project is not defined
[17:50:58] ReferenceError: project is not defined
at Gulp.<anonymous> (D:\Documenten\Howest\Semester 4\05 - Project\MarkeOnlinebis\Project Execution\MarkeOnline\gulpfile.js:9:23)
at module.exports (D:\Documenten\Howest\Semester 4\05 - Project\MarkeOnlinebis\Project Execution\MarkeOnline\node_modules\orchestrator\lib\runTask.js:34:7)
at Gulp.Orchestrator._runTask (D:\Documenten\Howest\Semester 4\05 - Project\MarkeOnlinebis\Project Execution\MarkeOnline\node_modules\orchestrator\index.js:273:3)
at Gulp.Orchestrator._runStep (D:\Documenten\Howest\Semester 4\05 - Project\MarkeOnlinebis\Project Execution\MarkeOnline\node_modules\orchestrator\index.js:214:10)
at Gulp.Orchestrator.start (D:\Documenten\Howest\Semester 4\05 - Project\MarkeOnlinebis\Project Execution\MarkeOnline\node_modules\orchestrator\index.js:134:8)
at C:\Users\hein_\AppData\Roaming\npm\node_modules\gulp\bin\gulp.js:129:20
at _combinedTickCallback (internal/process/next_tick.js:67:7)
at process._tickCallback (internal/process/next_tick.js:98:9)
at Module.runMain (module.js:592:11)
at run (bootstrap_node.js:394:7)
events.js:160
throw er; // Unhandled 'error' event
^
Error: node_modules\node-sass\test\fixtures\depth-first\_vars.scss
Error: Undefined variable: "$import-counter".
on line 1 of node_modules/node-sass/test/fixtures/depth-first/_vars.scss
>> $import_counter: $import_counter + 1;
-----------------^
at options.error (D:\Documenten\Howest\Semester 4\05 - Project\MarkeOnlinebis\Project Execution\MarkeOnline\node_modules\node-sass\lib\index.js:291:26)
Try Web Compiler plugin instead this is what I use to compile SCSS in MVC.
A Visual Studio extension that compiles LESS, Sass, JSX, ES6 and CoffeeScript files.
You can use another way easier I think.
Step 1
Go with this steps
in your NuGet Manager.
Add Microsoft.AspNet.Web.Optimization
Add BundleTransformer.SassAndScss
Add LibSassHost.Native.win-x64 if you use system 64 bit.
LibSassHost.Native.win-x86
Step2
In BundleConfig.cs add this code in RegisterBundles methode.
var nullBulider = new NullBuilder();
var nullOrderer = new NullOrderer();
BundleResolver.Current = new CustomBundleResolver();
var commonStyleBundle = new CustomStyleBundle("~/Bundle/sass");
commonStyleBundle.Include("~/css/main.scss");
commonStyleBundle.Orderer = nullOrderer;
bundles.Add(commonStyleBundle);
Step 3
Add CSS folder in your project and add main.scss file sheet inside.
Step 4
In your view, you need to use System.Web.Optimization.
#using System.Web.Optimization
And link your style sheet
#Styles.Render("~/Bundle/sass").
Step 5
In Global.asax we need to add this line in Application_Start().
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
Or maybe you will find it already in your class if you use MVC templet.
And that is it your main.scss its work.
This is how you can add Sass to your Mvc app:
Download WebCompiler:
https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebCompiler&ssr=false#qna
Double click on the Vsix file to install it.
Right click on solution, Manage Nuget Packages
Download bootstrap.sass package (version 4 or above)
Right click on the bootstrap.scss file under Content folder you need and select Web Compiler - Compile File
The bootstrap.css file will be generated.
You can select any scss file to compile.
You can see the configuration (list of files to be compiled) in the compilerconfig.json file in the root folder.
Add the css file to the bundle.
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap/main.css",
"~/Content/site.css"));
If you need to customize bootstrap, add a main.scss file in the same folder as bootstrap.scss. Then compile it using Web Compiler.
main.scss:
/* import the necessary Bootstrap files */
#import "_functions.scss";
#import "_variables.scss";
/* make changes to the !default Bootstrap variables */
$body-color: green;
/* finally, import Bootstrap to set the changes! */
#import "bootstrap.scss";
This example includes all the files, but make sure you only add the files you need to make the css smaller.
I have added poison library to rebar.config file:
{
deps, [
poison
]
}.
But when I run rebar3 compile, it shows me an error:
===> Package <<"poison">> not found. Fetching registry updates and trying again...
...
===> Package not found in registry: <<"poison">>.
How do I make it work?