• ArthurSlog

  • SLog-79

  • 1 Year,

  • Through China,

  • September 20th 2018

Scan the QR code on wechat and follow my official account

  • ArthurSlog.com

  • MSDN: ArthurSlog

  • GitHub: BlessedChild

  • NPMJS.com: arthurslog

  • The nuggets home page

  • Jane books home page

  • segmentfault

The weak are stronger than the strong

Development environment MacOS(High Sierra 10.13.6 (17G65))

Required information and information sources:

  • Electron

  • The Github address of ArthurSlogMarkdownEditor

Start coding

  • The previous post localised the Markdown editor from ArthurSlog.com

  • This time, package the localized ArthurSlogMarkdownEditor

  • Once packaged, you can start by double-clicking, no need to type on the command line to start

  • The package tool used this time is electron- Packager

  • Let’s switch to the project directory

cd ~/Desktop/ArthurSlogMarkdownEditor/

sudo npm i electron-packager –save-dev

sudo npm install electron-packager -g

  • Update package.json

~/Desktop/ArthurSlogMarkdownEditor/package.json

{
  "name": "ArthurSlogBrowser_Nodejs"."productName": "ArthurSlogMarkdownEditor"."version": "0.1.0 from"."description": "This is a Browser by Nodejs"."main": "main.js"."scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"."start": "electron ."."package-mac": "electron-packager . --overwrite --platform=darwin --arch=x64 --icon=assets/icons/mac/ICON.png.icns --prune=true --out=release-builds"."package-win": "electron-packager . electron-tutorial-app --overwrite --asar=true --platform=win32 --arch=ia32 --icon=assets/icons/win/ICON.png.ico --prune=true --out=release-builds --version-string.CompanyName=CE --version-string.FileDescription=CE --version-string.ProductName=\"ArthurSlogMarkdownEditor\""."package-linux": "electron-packager . electron-tutorial-app --overwrite --asar=true --platform=linux --arch=x64 --icon=assets/icons/linux/ICON.png --prune=true --out=release-builds"
  },
  "keywords": []."author": "ArthurSlog"."license": "ISC"."devDependencies": {
    "electron": "^ 2.0.9"."electron-packager": "^ 12.1.2." "
  },
  "dependencies": {
    "markdown-it": "^ 8.4.2"}}Copy the code
  • Create a new folder assets/ to store the app ICONS in the following directory:
assets
   | -- icons
          | -- mac
                | -- ICON.png.icns

            -- win
                | -- ICON.png.icns

            -- linux
                | -- ICON.png
Copy the code

  • The complete code, along with a compiled (packaged) executable, has been uploaded to Github: github.com/BlessedChil…

  • Hope interested friends can join in

  • Let’s do the last picture of our app

  • Insert a graph forcefully

  • The macOS executable has been compiled and will be updated in the future

  • At this point, ArthurSLogMarkdownEditor editor localization stage 2 GET! .

Please follow my wechat account ArthurSlog

Scan the QR code on wechat and follow my official account

If you like my article, please like it and leave a comment

thank you