In Windows 10 the taskbar is not showing my custom-made icon. I am using the latest (at the moment of writing) 0.51.1 version of nw.js and the taskbar icon always defaults doesn't matter what I am doing. Even though the .exe icon is changing on the build and behaves as expected.
Have anyone managed to solve this issue? I read almost all issues log on this topic on the official nw.js Github page but it doesn't help and seems like the issue still happens for some users.
here is my package.json file
{
"name": "com.domain.product",
"version": "0.1.0",
"build": {
"nwVersion": "0.51.1",
"nwFlavor": "normal",
"strippedProperties": [ "scripts", "devDependencies", "build", "chromium-args"],
"mac": {
"name": "Product Name",
"icon": "ProductName.icns"
},
"win": {
"name": "ProductName",
"icon": "icon/ProductName.ico"
},
"output": "../build"
},
"window": {
"width": 314,
"height": 660,
"frame": false,
"transparent": true,
"toolbar": false,
"resizable": false
},
"main": "index.html",
"node-remote": [ "<all_urls>"]
}
Here is a more complex example, but look for how icons are handled in the the window setting and in the build settings:
https://github.com/nwutils/nw-vue-cli-example/blob/master/package.json
You need to add the 'window.icon' property to your package.json. Something similar to:
"window": {
"icon": "./build/my-icon.png"
},
See the Manifest format documentation for more details: https://nwjs.readthedocs.io/en/latest/References/Manifest%20Format/#icon
Related
I am trying to open my PDF document with Skim from Visual Studio Code. I would like the View LaTeX PDF file command to open in Skim my PDF document and update it automatically. Unfortunately, when I click on the View LaTeX PDF file button, it does not open Skim.
I am forced :
To open Skim myself;
And then to open the PDF file;
When I do this, everything works fine. The file updates correctly each time I save the LaTeX file.
So I would like to be able to open Skim with the PDF document directly from Visual Studio Code. As I try to do at the beginning of the video.
Note that I have already read these questions SyncTex with Skim pdf viewer?, PDF Preview in Visual Studio Code and the documentation.
My configuration is the following:
macOS (12.1)
Visual Studio Code (1.63.0)
LaTeX Workshop plug-in (v8.22.0).
Skim 1.6.7 (137)
pdfTeX 3.141592653-2.6-1.40.22 (TeX Live 2021) kpathsea version 6.3.3
Latexmk, John Collins, 29 September 2020. Version 4.70b
settings.json
{
"workbench.colorTheme": "Cobalt2",
"editor.formatOnSave": true,
"[javascript]": {
"editor.formatOnSave": true
},
"[javascriptreact]": {
"editor.formatOnSave": true
},
"prettier.disableLanguages": [
"javascript",
"javascriptreact"
],
"workbench.startupEditor": "newUntitledFile",
"latex-workshop.intellisense.package.enabled": true,
"latex-workshop.intellisense.unimathsymbols.enabled": true,
"latex-workshop.latex.recipes": [
{
"name": "latexmk 🔃",
"tools": [
"latexmk"
]
},
{
"name": "pdflatex ➞ bibtex ➞ pdflatex`×2",
"tools": [
"pdflatex",
"bibtex",
"pdflatex",
"pdflatex"
]
}
],
"latex-workshop.latex.tools": [
{
"name": "latexmk",
"command": "latexmk",
"args": [
"-shell-escape",
"-synctex=1",
"-interaction=nonstopmode",
"-file-line-error",
"-pdf",
"-outdir=%OUTDIR%",
"%DOC%"
],
"env": {}
},
{
"name": "pdflatex",
"command": "pdflatex",
"args": [
"-synctex=1",
"-interaction=nonstopmode",
"-file-line-error",
"%DOC%"
],
"env": {}
},
{
"name": "bibtex",
"command": "bibtex",
"args": [
"%DOCFILE%"
],
"env": {}
},
{
"name": "latexmk",
"command": "latexmk",
"args": [
"-xelatex",
"-synctex=1",
"-interaction=nonstopmode",
"-file-line-error",
"%DOC%"
]
}
],
"latex-workshop.latex.clean.subfolder.enabled": true,
"git.autofetch": true,
"terminal.integrated.fontFamily": "Inconsolata for Powerline",
"latex-workshop.view.pdf.viewer": "external",
"editor.minimap.enabled": false,
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"files.exclude": {
"**/.classpath": true,
"**/.project": true,
"**/.settings": true,
"**/.factorypath": true
},
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"workbench.iconTheme": "material-icon-theme",
"prolog.executablePath": "/Applications/SWI-Prolog.app/Contents/MacOS/swipl",
"python.languageServer": "Microsoft",
"editor.wordWrap": "on",
"latex-workshop.view.pdf.zoom": "page-fit",
"latex-workshop.view.pdf.external.viewer.args": [
"0",
"%PDF%"
],
"latex-workshop.view.pdf.external.viewer.command": "/Applications/Skim.app/Contents/SharedSupport/displayline",
"latex-workshop.view.pdf.external.synctex.command": "/Applications/Skim.app/Contents/SharedSupport/displayline",
"latex-workshop.view.pdf.external.synctex.args": [
"-r",
"-b",
"%LINE%",
"%PDF%",
"%TEX%"
],
"latex-workshop.latex.autoBuild.cleanAndRetry.enabled": true,
"latex-workshop.latex.autoClean.run": "onBuilt",
"latex-workshop.latex.clean.fileTypes": [
"*.aux",
"*.bbl",
"*.blg",
"*.idx",
"*.ind",
"*.lof",
"*.lot",
"*.out",
"*.toc",
"*.acn",
"*.acr",
"*.alg",
"*.glg",
"*.glo",
"*.gls",
"*.ist",
"*.fls",
"*.log",
"*.fdb_latexmk",
"*.snm",
"*.nav",
"*.synctex.gz",
"*.run.xml",
"*.bcf",
"__latexindent_temp.tex"
],
"explorer.confirmDelete": false,
"latex-workshop.latexindent.path": "/usr/local/texlive/2021/bin/universal-darwin/latexindent",
"security.workspace.trust.untrustedFiles": "open",
"editor.fontSize": 16
}
So...In fact, the problem does not come from the setting file. It is well formed and valid. The problem is a scripting support bug in Monterey12.1. The sdef parser can't handle synonyms. This has been documented here.
A workaround while waiting for an update is to edit the file /Applications/Skim.app/Contents/Resources/Skim.sdef and comment these lines of code
<!-- <synonym name="selection for"/> -->
<!-- <synonym name="get preferences"/> -->
It's not the kind of solution I like, but, in the meantime, it does the job here at first.
I'm trying to display an URL upon invoke (task/fetch) via MS Teams bot. The URL is loading and working perfectly fine on android/ios app. But it is not loading at all in web/desktop app. The app has been in production for some time now and I recently updated the app manifest with valid domains for making the URLs load in Teams.
Also I tried the same manifest/backend with another test app and URLs are loading fine in web/mobile app. Not sure what am I missing here.
Please find below my task/fetch response and manifest details.
task/fetch response
{
"task": {
"type": "continue",
"value": {
"title": "Task Module Test",
"height": 1200,
"width": 1000,
"url": "https://www.contoso.com/msteams/taskmodules/newcustomer",
"fallbackUrl": "https://www.contoso.com/msteams/taskmodules/newcustomer"
}
}
}
My App Manifest (have edited some sensitive info but the structure of the manifest is intact)
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.8/MicrosoftTeams.schema.json",
"manifestVersion": "1.8",
"version": "1.0.0",
"showLoadingIndicator": true,
"id": "some-id",
"packageName": "com.example.bots.msteams",
"developer": {
"name": "Test",
"websiteUrl": "https://www.example.com",
"privacyUrl": "https://www.example.com/policy",
"termsOfUseUrl": "https://www.example.com/terms"
},
"icons": {
"color": "color.png",
"outline": "outline.png"
},
"name": {
"short": "Test Short",
"full": "Test Long"
},
"description": {
"short": "Short desc",
"full": "Long desc"
},
"accentColor": "#FFFFFF",
"bots": [
{
"botId": "some-id",
"scopes": [
"personal"
],
"supportsFiles": true,
"isNotificationOnly": false
}
],
"permissions": [
"identity",
"messageTeamMembers"
],
"validDomains": [
"www.contoso.com"
]
}
URL successfully loading on Phone app
URL not loading on web/desktop app
Happy to provide any other info if needed!
Ok, found the fix (but I have no clue why it works). I removed showLoadingIndicator property from the manifest and the URLs are loading fine now.
I couldn't find much help on what that property does from MS docs.
Glad that you found the solution and thanks for posting it back to help other community members.
When you set showLoadingIndicator to true, as a mandatory step you need to call microsoftTeams.appInitialization.notifySuccess() to notify Teams that your app has successfully loaded.
The behavior on mobile clients is not configurable through the native loading indicator property. Mobile clients show this indicator by default across content pages and iframe-based task modules.
Here is documentation on Show Loading Indicator.
While installing the appx now i am able to see logo on launcher/install popup screen.
This worked when i made below changes:
1)Downgraded electron-builder version to: 20.39.0
2)Changed the directories entry in package.json as :
directories:{
"buildResources": "build",
"output": "build"}
3)Created appx named folder inside the build directory and created the build directory at package.json level
4)Added icon named "StoreLogo.png" inside build/appx directory that we have created earlier.
5)add the entry of the same in :
"win": {
"icon":"build/appx/StoreLogo.png"
}
6)After this just create the appx using electron-builder -w appx command
Now I have one more doubt after complete installation i am still seeing the default electron logo at the task-bar and also in the apps & features if i search for my application.
On the launcher/install popup i am able to see the app logo like below hidden with red color:
After installing and launching the app i am still able to see the default electron icon in the taskbar as below highlighted in red:
This is how my package.json build property looks:
{
"build": {
"extraFiles": [
"node_modules/ionic-enterprise-couchbase-lite-electron/**/*"
],
"publish": [
{
"provider": "generic",
"url": "***********"
}
],
"appId": "**************",
"nsis": {
"perMachine": true,
"oneClick": false,
"allowToChangeInstallationDirectory": true
},
"squirrelWindows": {},
"files": [
"electron.js",
"www/**/*",
"build/Square150x150Logo.png",
"build/Square44x44Logo.png"
],
"directories": {
"buildResources": "build",
"output": "build"
},
"appx": {
"identityName": "myApp",
"publisher": "CN=*************************",
"publisherDisplayName": "my Company",
"applicationId": "myApp",
"displayName": "myApp",
"backgroundColor": "#f2f4f7"
},
"win": {
"certificateFile": "./certs/CordovaApp.Windows10_StoreKey.pfx",
"publisherName": "my Company",
"icon": "build/appx/StoreLogo.png",
"target": [
{
"target": "nsis",
"arch": [
"ia32"
]
},
"appx",
"msi"
]
},
"nodeGypRebuild": "false",
"npmRebuild": "false"
}
}
I tried adding all related resources as mentioned in : https://www.electron.build/configuration/appx but it started giving error of invalid manifest when creating a appx.
So can anyone please help me to resolve this issue?
I solved the issue by doing below changes:
1) Added the assets mentioned in the appx link: https://www.electron.build/configuration/appx
2) created appx folder in the build directory, keep the package.json as mentioned above.
3)Make sure the app logos named should be specific as metioned in the link .PNG format.
4)Earlier I had icon names as e.g: Square44x44Logo.png format .PNG then after changing the name to Square44x44Logo kept format .PNG as it is I was able to solve installed app issue.
What i realized by this is naming convention does matter a lot in case of applying icons. So the main issue caused due to pont 4.
I have a PWA built with CRA, it's hosted on Heroku. The PWA is downloadable on my iOS device and everything works fine, EXCEPT the icon.
I'm not sure if the file reference is correct, because it changes during Heroku Build. I've tried both my localhost file reference and the post-build reference, but neither gives me the option to use the icon.
I'm brand new to PWAs, so maybe I'm making a dumb mistake
Here is the manifest.json (the file references here are post-build, based on the 'Sources' tab in Chrome dev tools):
{
"short_name": "Sonar",
"name": "Sonar",
"icons": [
{
"src": "static/media/sonar_backup.cb32ebcc.png",
"type": "image/png",
"sizes": "128x128"
},{
"src": "static/media/sonar_backup.cb32ebcc.png",
"type": "image/png",
"sizes": "144x144"
},{
"src": "static/media/sonar_backup.cb32ebcc.png",
"type": "image/png",
"sizes": "192x192"
},{
"src": "static/media/sonar_backup.cb32ebcc.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": "/",
"display": "standalone",
"theme_color": "#512DA8",
"background_color": "#512DA8"
}
Any thoughts appreciated.
I found my own answer, and I'll post here in case anyone else comes across this problem.
What I was doing in the manifest.json file was sufficient for Android PWA icons, but at the time of this post, iOS requires a different process.
The fix was in the root folder, in index.html, add:
<link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/profilePicture/sonar_backup.png">
That link tells the iOS to specifically read this href, and assign it as the app icon.
A lot more good information available here:
https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
I am working on an angular-cli v1.0.5 (angular 4) project. Below is the output of the ng -v command.
#angular/cli: 1.0.5
node: 6.10.3
os: win32 x64
#angular/common: 4.1.3
#angular/compiler: 4.1.3
#angular/core: 4.1.3
#angular/forms: 4.1.3
#angular/http: 4.1.3
#angular/platform-browser: 4.1.3
#angular/platform-browser-dynamic: 4.1.3
#angular/router: 4.1.3
#angular/cli: 1.0.5
#angular/compiler-cli: 4.1.3
I am also using;
Typescript version 2.3.4
Webpack version 2.2.1
Chrome Version 58.0.3029.110 (64-bit)
Windows 10
VS Code version 1.13.0
Debugger for Chrome version 3.1.2
I am trying to get debugging to work in VS Code but all of my breakpoints are dimmed and when I hover over them, I get the message "Breakpoint ignored because generated code was not found."
Directory Structure - My project starts in the masclient folder. This is where my package.json and angular-cli.json files are at. Within the masclient folder, I have a src folder and within the src folder, I have an app folder. My angular 4 app.module.ts is in this folder. All of my components are in their own folders below the app folder. The specific typescript file I am trying to debug is in the masclient\src\app\bulk-labels\create-bulk-labels folder
My launch.json file is shown below;
{
"version": "0.2.0",
"configurations": [
{
"name": "LaunchChrome",
"type": "chrome",
"request": "launch",
"url": "http://localhost:4200",
"sourceMaps": true,
"webRoot": "${workspaceRoot}/src",
"diagnosticLogging": false,
"userDataDir": "${workspaceRoot}/.vscode/chrome",
"sourceMapPathOverrides": {
"webpack:///C:*": "c:/*"
}
},
{
"name": "AttachChrome",
"type": "chrome",
"request": "attach",
"port": 9222,
"sourceMaps": true,
"webRoot": "${workspaceRoot}/src",
"diagnosticLogging": true,
"sourceMapPathOverrides": {
"webpack:///*": "/*"
}
}
]
}
My angular-cli.json is shown below;
{
"$schema": "./node_modules/#angular/cli/lib/config/schema.json",
"project": {
"name": "masclient"
},
"apps": [
{
"root": "src",
"outDir": "dist",
"assets": [
"assets",
"favicon.ico"
],
"index": "index.html",
"main": "main.ts",
"polyfills": "polyfills.ts",
"test": "test.ts",
"tsconfig": "tsconfig.app.json",
"testTsconfig": "tsconfig.spec.json",
"prefix": "masc",
"styles": [
"../node_modules/bootstrap/dist/css/bootstrap.min.css",
"styles/vendor.scss",
"styles/main.scss"
],
"scripts": [
"../node_modules/jquery/dist/jquery.min.js",
"../node_modules/tether/dist/js/tether.min.js",
"../node_modules/bootstrap/dist/js/bootstrap.min.js"
],
"environmentSource": "environments/environment.ts",
"environments": {
"dev": "environments/environment.ts",
"prod": "environments/environment.prod.ts"
}
}
],
"e2e": {
"protractor": {
"config": "./protractor.conf.js"
}
},
"lint": [
{
"project": "src/tsconfig.app.json"
},
{
"project": "src/tsconfig.spec.json"
},
{
"project": "e2e/tsconfig.e2e.json"
}
],
"test": {
"karma": {
"config": "./karma.conf.js"
}
},
"defaults": {
"styleExt": "scss",
"component": {}
}
}
My tsconfig.json file is shown below;
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "dist/out-tsc",
"baseUrl": "src",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/#types"
],
"lib": [
"es2016",
"dom"
]
}
}
I have gone through several recommendations I have found on Google with no luck. Most seem to refer to the process before angular-cli switched to webpack. There seem to be a lot of variation of property settings in the launch.json file. As I read through the posts before deciding to post my own question here, it seems that the issue may be related to the fact that the ng serve process keeps all of the compiled files in memory rather than pulling the map files from a ./dist folder... but I am not sure how that would change the location settings in the launch.json file.
I start debugging using the following process;
Run ng serve from the command line to start the web server
From within VS Code, I go to the Debug section and click on the green arrow next to "Launch Chrome" ( or press F5)
I have also tried this process;
Run ng serve from the command line to start the web server
Launch chrome.exe --remote-debugging-port=9222 from an admin level command prompt.
In the instance of Chrome that launched, navigate to locaohost:4200
From within VS Code, I go to the Debug section and click on the green arrow next to "Launch Chrome" ( or press F5)
With either of the startup methods listed above, wile viewing my source code *.ts files in the VS Code editor, I can see that my breakpoints are grayed out as soon as the debugger starts.
I am sure it probably just a matter of getting my settings in the various config files synced properly, but after several hours of research, the actual solution has eluded me.
Any help would be greatly appreciated.