27000 star! This open source tool turns web pages into native applications

Time:2021-10-26

[introduction]: a command line tool to turn web pages into local applications.

27000 star! This open source tool turns web pages into native applications

brief introduction

Nativefier is a command-line tool that can easily create desktop applications for any website with minimal configuration and turn web pages into local applications. The website is packaged into local executable files such as. App and. Exe through electron + chromium, which supports running on windows, MacOS and Linux operating systems.

For example, to create an executable for WhatsApp web, you only need to run the following command:

nativefier 'web.whatsapp.com'

The project address is:

https://github.com/nativefier…

install

  • macOS 10.9 + Windows + Linux
  • Node. JS > = 12.9 and NPM > = 6.9
  • Optional dependency
    • Use ImageMagick or graphicsmagick to convert icons. Ensure that convert and identify or GM are in the system path $path.
    • Wine packages Windows applications on non windows platforms. Make sure wine is in the system path $path.

Then, install nativefier globally:

npm install -g nativefier

usage

To create a native desktop application for media.com, simply execute the following command:

nativefier "medium.com"

Nativefier will set the application name and many other options by default. You can also override these options. For example, to override the name:

nativefier --name 'My Medium App' 'medium.com'

Common command line options are:

-h. -- help print usage information
-v. -- version print nativefier version
-a. -- arch < value > target processor architecture at build time, IA32, x64, armv7l, arm64
-c. -- consistent specifies whether the source code in the localized application is packaged together. The default is false
-e. -- electron version < value > specifies the electron version
-i. -- icon < Path > specifies the application icon
When packaging for windows, it must be the path to the. ICO file.
When packaging for Linux, it must be the path to the. PNG file.
When packaging for MacOS, if optional dependencies are installed, it must be an. ICNs or a. PNG file. If there is an image conversion tool (iconutil, or ImageMagick's convert + identify, or graphicsmagick's GM), nativefier will automatically convert. PNG to. ICNs
-n. -- name < value > the name of the application. When used on Linux, do not include spaces
--No overwrite specifies whether the target directory should not be overwritten. The default is false
-p. -- platform < value > execution platform. It defaults to the current operating system, and can also be specified as Linux, windows, OSX or MAS
--Portable enables applications to store user data (cookies, caches, etc.) in application folders
--Always on top application starts at the top of the screen
--Background color < string > specifies the background color, https://www.electronjs.org/docs/api/browser-window#setting -backgroundcolor
--Bookmarks menu < string > defines the path of JSON file of bookmark menu, such as:
{
    "menuLabel": "&Music",
    "bookmarks": [
        {
            "title": "lofi.cafe",
            "url": "https://lofi.cafe/",
            "type": "link",
            "shortcut": "CmdOrCtrl+1"
        },
        {
            "title": "beats to relax/study to",
            "url": "https://www.youtube.com/watch?v=5qap5aO4i9A",
            "type": "link",
            "shortcut": "CmdOrCtrl+2"
        },
        {
            "type": "separator"
        },
        {
            "title": "RÜFÜS DU SOL Live from Joshua Tree",
            "type": "link",
            "url": "https://www.youtube.com/watch?v=Zy4KtD98S2c"
        }
    ]
}
--Disable context menu disable context menu
--Disable dev tools disable chrome developer tools
--Full screen enables the packaged application to start in full screen
--Height < value > the height of the packaged application, which is 800px by default
--Hide window frame disables window frames and controls
--Max height < value > the maximum height of the packaged application, which is unlimited by default
--Max width < value > the maximum width of the packaged application, which is unlimited by default
--Maximize maximizes startup of packaged applications
--Min height < value > the minimum height of the packaged application, which is 0 by default
-m. -- show menu bar should the menu bar be displayed
--Single instance singleton to prevent applications from running multiple times
--Title bar style < value > sets the style applied to the title bar
/* site.css */

/* header is draggable... */
header {
  -webkit-app-region: drag;
}

/* but any buttons inside the header shouldn't be draggable */
header button {
  -webkit-app-region: no-drag;
}

/* perhaps move some items out of way for the traffic light */
header div:first-child {
  margin-left: 100px;
  margin-top: 25px;
}
--X < value > x position of the packaged application window
--Y < value > y position of the packaged application window
--Zoom < value > sets the default zoom factor to be used when the application is opened. The default is 1.0
--Lang < value > set language, "fr", "en US", "es", etc

Use with docker

Nativefier can also be used in docker.

  • Pull the latest stable image from docker hub:
docker pull nativefier/nativefier
  • Or build your own image:
docker build -t local/nativefier .
  • To build a local application using docker:
docker run --rm -v ~/nativefier-apps:/target/ local/nativefier https://mail.google.com/ /target/

Open source outpostShare popular, interesting and practical open source projects on a daily basis. Participate in maintaining the open source technology resource library of 100000 + star, including python, Java, C / C + +, go, JS, CSS, node.js, PHP,. Net, etc.