I am trying to add an executable file to an application that I am making using vuejs and electron so that I can run it on the user's computer from the application.
But after building and running on the user's computer, this folder with the program does not appear in the resources folder of my program.
My vue.config.js
pluginOptions: {
electronBuilder: {
extraResources: [
{
"from": "extraResources/SumatraPDF-3.4.6-64.exe",
"to": "extraResources/SumatraPDF-3.4.6-64.exe"
}
],
win: {
target: "portable"
}
}
}
This solved my problem
module.exports = defineConfig({
transpileDependencies: true,
pluginOptions: {
electronBuilder: {
builderOptions: {
extraResources: [
{
"from": "extraResources/SumatraPDF-3.4.6-64.exe",
"to": "extraResources/SumatraPDF-3.4.6-64.exe"
}
],
win: {
target: "portable"
}
}
}
}
});
Related
I have a nextjs project with a :client param which represents a client, like this:
domain.com/:client
And I have multiple clients... so I need to do this rewrite:
:client.domain.com -> domain.com/:client
For example for clients:
google.domain.com -> domain.com/google
netflix.domain.com -> domain.com/netflix
...
Inside the same project.
Any way to do that?
You can use the redirects option in the vercel.json, as Maxime mentioned.
However, it requires 1 extra key.
For example, if your app is available at company.com:
{
...
redirects: [
{
"source": "/",
"has": [
{
"type": "host",
"value": "app.company.com"
}
],
"destination": "/app"
}
]
}
More info:
Example Guide
vercel.json docs
Create a config in your project root with next.config.js
If this file exists add the following snippet to it, Mind you, we used example.com in place of domain .com as Body cannot contain "http://domain. com" in stackoverflow
// next.config.js
module.exports = {
async redirects() {
return [
{
source: "/:path*",
has: [
{
type: "host",
value: "client.example.com",
},
],
destination: "http://example.com/client/:path*",
permanent: false,
},
];
},
};
To confirm it's also working in development, try with localhost
module.exports = {
reactStrictMode: true,
// async rewrites() {
async redirects() {
return [
{
source: "/:path*",
has: [
{
type: "host",
value: "client.localhost",
},
],
destination: "http://localhost:3000/client/:path*",
permanent: false,
},
];
},
};
Dynamic Redirect
To make it dynamic, we'll create an array of subdomains
const subdomains = ["google", "netflix"];
module.exports = {
async redirects() {
return [
...subdomains.map((subdomain) => ({
source: "/:path*",
has: [
{
type: "host",
value: `${subdomain}.example.com`,
},
],
destination: `https://example.com/${subdomain}/:path*`,
permanent: false,
})),
];
},
}
You can read more from the official next.js doc redirects or rewrite
No such file or directory, when using Vite and Antd Pro Layout
This is file vite.config.ts:
import { defineConfig } from 'vite';
import reactRefresh from '#vitejs/plugin-react-refresh';
import path from 'path';
import vitePluginImp from 'vite-plugin-imp';
export default defineConfig({
plugins: [
reactRefresh(),
vitePluginImp({
libList: [
{
libName: 'antd',
style: (name) => {
return `antd/lib/${name}/style/index.less`;
},
},
],
}),
],
css: {
preprocessorOptions: {
less: {
javascriptEnabled: true,
modifyVars: {
...{
'primary-color': '#1DA57A',
'link-color': '#1DA57A',
'border-radius-base': '2px',
},
},
},
},
},
resolve: {
alias: [
{
find: /^~/,
replacement: path.resolve(__dirname, 'src'),
},
],
},
optimizeDeps: {
include: ['#ant-design/icons'],
},
});
This is my config to using antd, antd-pro-layout with vite.
But I received the error:
[vite] Internal server error: ENOENT: no such file or directory, open
'/Users/tranthaison/DEV/vite2-react-ts/srcantd/es/style/themes/default.less'
Can someone help me to fix it?
I had some problems when using React + Antd in Vite.
Thanks for #theprimone for the answer. But the answer is incomplete. I will complete the answer here.
First time, add additional config to Less Preprocessor:
Add this config to your vite.config.js file:
{
css: {
preprocessorOptions: {
less: {
javascriptEnabled: true,
},
},
},
}
Second, setting module aliases to fix Less #import problem:
Again, add the following config into your vite.config.js file:
{
resolve: {
alias: [
{ find: /^~/, replacement: "" },
],
},
}
Last, install vite-plugin-imp plugin to solve Antd ES problem:
Install the vite-plugin-imp dependencies:
pnpm add -D vite-plugin-imp
# or
npm i -D vite-plugin-imp
then, setup the plugin in your vite.config.js file:
{
plugins: [
// React plugin here
vitePluginImp({
libList: [
{
libName: "antd",
style: (name) => `antd/es/${name}/style`,
},
],
}),
];
}
The final configuration in vite.config.js file will look like this:
import { defineConfig } from "vite";
import reactRefresh from '#vitejs/plugin-react-refresh';
import vitePluginImp from "vite-plugin-imp";
export default defineConfig({
css: {
preprocessorOptions: {
less: {
javascriptEnabled: true,
},
},
},
resolve: {
alias: [
{ find: /^~/, replacement: "" },
],
},
plugins: [
reactRefresh(),
vitePluginImp({
libList: [
{
libName: "antd",
style: (name) => `antd/es/${name}/style`,
},
],
}),
],
});
Also work with #preact/preset-vite.
Ref:
https://github.com/theprimone/vite-react
https://github.com/ant-design/ant-design/issues/7850
https://github.com/vitejs/vite/issues/2185#issuecomment-784637827
Try to import antd styles like this:
vitePluginImp({
libList: [
{
libName: 'antd',
style: (name) => `antd/es/${name}/style`,
},
],
}),
More usage of Vite + React + Ant Design or other UI Library, this repo theprimone/vite-react might give you more or less inspiration.
I wanted to create ECS task that takes all json as its environment input. But my cdk code won't deploy because of following error message, the error message is so vague and it is difficult for me to figure out why my code is wrong.
Failed to call Step Functions for request: 'com.amazonaws.services.stepfunctions.model.CreateStateMachineRequest'. (Service: null; Status Code: 500; Error Code: null; Request ID: null)
new StateMachine (/local/home/miae/Explanation/src/ForecastingDeepLearningExplanationInfrastructure/node_modules/#aws-cdk/aws-stepfunctions/lib/state-machine.ts:101:26)
My cdk code
...
const ecsFargateTask = new sfn.Task(this, 'myEcs', {
inputPath: "$",
resultPath: "$.ecs",
task: new class implements sfn.IStepFunctionsTask {
bind(): sfn.StepFunctionsTaskConfig {
return {
resourceArn: "arn:aws:states:::ecs:runTask.sync",
parameters: {
"LaunchType": "FARGATE",
"Cluster": props.cluster.clusterArn,
"TaskDefinition": taskDefinition.taskDefinitionArn,
"Overrides": {
"ContainerOverrides": [{
"Name": "myContainer",
"Environment.$": "$.envs"
}]
}
}
};
}
}
});
}
const chain = sfn.Chain.start(ecsFargateTask);
new sfn.StateMachine(this, `StateMachineCopy${props.stage}`, {
definition: chain,
timeout: cdk.Duration.seconds(3000)
});
This is the Step function I want, and I could manually create this without problem.
{
"StartAt": "ExplanationEcs",
"States": {
"ExplanationEcs": {
"End": true,
"InputPath": "$",
"Parameters": {
"LaunchType": "FARGATE",
"Cluster": "arn:aws:ecs:us-west-2:123456789:cluster/myCluster482E02CC-1VWQ5XRG4II88",
"TaskDefinition": "arn:aws:ecs:us-west-2:123456789:task-definition/myTaskDefinitionE3E6548C:3",
"Overrides": {
"ContainerOverrides": [
{
"Name": "myContainer",
"Environment.$": "$.envs"
}
]
}
},
"Type": "Task",
"Resource": "arn:aws:states:::ecs:runTask.sync",
"ResultPath": "$.ecs"
}
},
"TimeoutSeconds": 3000
}
electron updater 4.2.0 package do not download new release but can detect it
This is a private repository on github
new releases successfully send to github
In package.json:
"build": {
"appId": "com.myApp.ID",
"npmRebuild": false,
"win": {
"icon": "./resources/electron/icons/256x256.png",
"publish": [
{
"provider": "github",
"owner": "me",
"repo": "POS",
"private": true,
"releaseType": "release",
"token": "<private token>"
}
],
"target": [
{
"target": "nsis",
"arch": [
"x64"
]
}
]
}
},
my electron.js file or main.js I have :
win.webContents.on('did-finish-load', () => {
if(!serve) {
appUpdater(win);
}
});
appUpdater function is:
function appUpdater(win) {
autoUpdater.autoInstallOnAppQuit = true;
autoUpdater.autoDownload = true;
autoUpdater.logger = logger;
/* Log whats happening
TODO send autoUpdater events to renderer so that we could console log it in developer tools
You could alsoe use nslog or other logging to see what's happening */
let foundUpdate = false;
autoUpdater.on('checking-for-update', () => {
dialog.showMessageBox(win, {
message: 'CHECKING FOR UPDATES !!'
});
});
autoUpdater.on('update-available', () => {
foundUpdate = true;
dialog.showMessageBox(win, {
message: ' update-available !!'
});
});
autoUpdater.on('error', error => {
autoUpdater.logger.debug(error);
});
// Ask the user if update is available
autoUpdater.on('update-downloaded', (_event, releaseNotes, _releaseName) => {
let message = 'A new version is now available. It will be installed the next time you restart the application.';
dialog.showMessageBox(win, {
type: 'question',
buttons: ['Install', 'Later'],
defaultId: 0,
message: 'A new version has been downloaded',
detail: message
}, response => {
if(response === 0) {
setTimeout(() => autoUpdater.quitAndInstall(), 1);
}
});
});
// init for updates
setInterval(() => {
if(!foundUpdate) {
autoUpdater.checkForUpdates();
}
}, 60000);
}
exports.appUpdater = appUpdater;
I get documented from auto updater
Auto-updatable Targets is windows nsis
checking-for-update and update-available event fire correctly but update-downloaded or error simply does not fire
Please if you already have experience on this let me know
note: I set environment variable GH_TOKEN in the user machine too
Better now than never
I was struggling with the new update of mac bigSur as electron-builder#^20.38.0 was giving me very bad errors!!!
So I decided to update to the latest version
electron: ^12.0.2
electron-builder: ^22.10.5
electron-updater: ^4.3.8
It was not working at first giving me error like:
Cannot download differentially, fallback to full download: Error: Maximum allowed size is 50 MB.
At last my version of node was v10.15.1 locally
I updated to v14.16.0 now it works!
Another issue using other versions update and downgrade
it was downloading it but failed on install.
Same problem with some specifics versions of electron-builder and electron-updater.For me, it works with exactly:
"electron-builder": "22.11.7"
"electron-updater": "4.3.8"
But for instance, it does not work anymore with electron-updater 4.3.9 ...
I am developing an extension for Firefox for Android, but since tabs APIs are not supported on Firefox(Android), I am using the following code. It is working fine on Firefox but when porting it to Firefox Android(52 version), background script messages are not being passed to content script listener.
//Content script code
var myPort = browser.runtime.connect({name:"port-from-cs"});
myPort.postMessage({greeting: "hello from content script"});
myPort.onMessage.addListener(function(m) {
console.log("In content script, received message from background script: ");
console.log(m.greeting);
});
// background script
var portFromCS;
function connected(p) {
portFromCS = p;
portFromCS.postMessage({greeting: "hi there content script!"});
portFromCS.onMessage.addListener(function(m) {
console.log("In background script, received message from content script")
console.log(m.greeting);
portFromCS.postMessage({greeting: "hi there content script!"});
});
}
browser.runtime.onConnect.addListener(connected);
//manifest
{
"version": "0.1.5",
"content_scripts": [
{
"js": [
"js/myContentScript.js",
"js/lib/jquery-1.9.1.min.js"
],
"matches": [
"<all_urls>"
],
"run_at": "document_start"
}
],
"description": "xxx",
"manifest_version": 2,
"name": "xx",
"applications": {
"gecko": {
"id": "vpt#mozilla.org"
}
},
"permissions": [
"webRequest",
"notifications",
"http://*/",
"https://*/",
"storage",
"webRequestBlocking"
],
"background": {
"scripts": [
"js/background.js"
]
},
"web_accessible_resources": [
"xxx.js"
]
}
content script is passing the message to background script, but background script messages are caught by portFromCS.onMessage listener. Is my approach correct?