<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問(wèn)答1問(wèn)答10問(wèn)答100問(wèn)答1000問(wèn)答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問(wèn)答文章1 問(wèn)答文章501 問(wèn)答文章1001 問(wèn)答文章1501 問(wèn)答文章2001 問(wèn)答文章2501 問(wèn)答文章3001 問(wèn)答文章3501 問(wèn)答文章4001 問(wèn)答文章4501 問(wèn)答文章5001 問(wèn)答文章5501 問(wèn)答文章6001 問(wèn)答文章6501 問(wèn)答文章7001 問(wèn)答文章7501 問(wèn)答文章8001 問(wèn)答文章8501 問(wèn)答文章9001 問(wèn)答文章9501
        當(dāng)前位置: 首頁(yè) - 科技 - 知識(shí)百科 - 正文

        使用electron將vue-cli項(xiàng)目打包成exe的方法

        來(lái)源:懂視網(wǎng) 責(zé)編:小采 時(shí)間:2020-11-27 22:06:54
        文檔

        使用electron將vue-cli項(xiàng)目打包成exe的方法

        使用electron將vue-cli項(xiàng)目打包成exe的方法:如果你已經(jīng)做好了一個(gè)vue的項(xiàng)目,并且想要將他打包成exe,那么請(qǐng)繼續(xù)閱讀。 首先你可以下載一個(gè)demo了解一下。 git clone https://github.com/electron/electron-quick-start cd electron-quick-start npm install npm
        推薦度:
        導(dǎo)讀使用electron將vue-cli項(xiàng)目打包成exe的方法:如果你已經(jīng)做好了一個(gè)vue的項(xiàng)目,并且想要將他打包成exe,那么請(qǐng)繼續(xù)閱讀。 首先你可以下載一個(gè)demo了解一下。 git clone https://github.com/electron/electron-quick-start cd electron-quick-start npm install npm

        如果你已經(jīng)做好了一個(gè)vue的項(xiàng)目,并且想要將他打包成exe,那么請(qǐng)繼續(xù)閱讀。

        首先你可以下載一個(gè)demo了解一下。

        git clone https://github.com/electron/electron-quick-start
        cd electron-quick-start
        npm install
        npm start

        這個(gè)demo主要就是main.js和package.json

        打開(kāi)main.js

        const {app, BrowserWindow} = require('electron')
        let mainWindow
        function createWindow () {
         // Create the browser window.
         mainWindow = new BrowserWindow({width: 800, height: 600})//創(chuàng)建一個(gè)瀏覽器窗口,可配置寬高
         // and load the index.html of the app.
         mainWindow.loadFile('index.html')//加載html
         // Open the DevTools.
         // mainWindow.webContents.openDevTools()//打開(kāi)調(diào)試窗口
         mainWindow.on('closed', function () {
         mainWindow = null
         })
        }
        
        app.on('ready', createWindow)
        app.on('window-all-closed', function () {
         if (process.platform !== 'darwin') {
         app.quit()
         }
        })
        app.on('activate', function () {
         if (mainWindow === null) {
         createWindow()
         }
        })
        

        package.json

        {
         "name": "electron-quick-start",
         "version": "1.0.0",
         "description": "A minimal Electron application",
         "main": "main.js",//入口,根據(jù)自己的項(xiàng)目修改
         "scripts": {
         "start": "electron ."
         },
         "repository": "https://github.com/electron/electron-quick-start",
         "keywords": [
         "Electron",
         "quick",
         "start",
         "tutorial",
         "demo"
         ],
         "author": "GitHub",
         "license": "CC0-1.0",
         "devDependencies": {
         "electron": "^2.0.0"
         }
        }

        運(yùn)行 npm start

        顯示窗口

        ok,現(xiàn)在我們?cè)谧约旱捻?xiàng)目上安裝兩個(gè)依賴

        npm install electron --save-dev
        npm install electron-packager --save-dev

        electron有兩種打包方式,electron-packager和electron-builder,官方推薦electron-builder,但是較為麻煩,初學(xué)者建議先用

        electron-packager

        首先將例子中的main.js復(fù)制一份并重命名為electron

        修改為 mainWindow.loadFile(‘./dist/index.html')

        然后對(duì)你的項(xiàng)目進(jìn)行打包,npm run build

        打包完成后,將electron.js 在復(fù)制一份到dist目錄下,修改mainWindow.loadFile(‘index.html')

        將項(xiàng)目根目錄下的package.json修改

        如同以下

        "main": "build/electron.js",//入口
         "scripts": {
         "dev": "node build/dev-server.js",
         "start": "npm run dev",
         "build": "node build/build.js",
         "test": "electron .",
         "electron_build": "electron-packager ./dist exeName --platform=win32 --arch=x64 --icon=./assets/img/favicon.ico --overwrite"
         },
         

        復(fù)制package.json到dist目錄下,修改

         "main": "electron.js",1

        運(yùn)行npm test 打開(kāi)項(xiàng)目

        運(yùn)行npm run electron_build 進(jìn)行打包,exe圖標(biāo)必須有,格式是ico,exeName是exe的名稱,根據(jù)自己需要配置

        為什么要在dist目錄加上electron.js和package.json呢?這是因?yàn)閮?nèi)部機(jī)制會(huì)找到index.html下package.json進(jìn)行打包

        以上這篇使用electron將vue-cli項(xiàng)目打包成exe的方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。

        聲明:本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí),若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系,我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        使用electron將vue-cli項(xiàng)目打包成exe的方法

        使用electron將vue-cli項(xiàng)目打包成exe的方法:如果你已經(jīng)做好了一個(gè)vue的項(xiàng)目,并且想要將他打包成exe,那么請(qǐng)繼續(xù)閱讀。 首先你可以下載一個(gè)demo了解一下。 git clone https://github.com/electron/electron-quick-start cd electron-quick-start npm install npm
        推薦度:
        標(biāo)簽: 使用 VUE exe
        • 熱門(mén)焦點(diǎn)

        最新推薦

        猜你喜歡

        熱門(mén)推薦

        專題
        Top
        主站蜘蛛池模板: 亚洲综合网站色欲色欲| 亚洲福利在线播放| 亚洲色偷偷av男人的天堂| 国产免费播放一区二区| 国产黄色一级毛片亚洲黄片大全| 国产精品亚洲综合网站| 五月天婷亚洲天综合网精品偷| 国产午夜亚洲精品不卡电影| 国产人成免费视频| 国产亚洲精品精品精品| 亚洲av日韩片在线观看| 一区二区三区在线观看免费| 亚洲精品自产拍在线观看| 免费福利在线视频| 亚洲最新中文字幕| 女人让男人免费桶爽30分钟| 美女露隐私全部免费直播| 久久精品夜色噜噜亚洲A∨| 久久精品网站免费观看| 亚洲无人区码一二三码区别图片| 免费特级黄毛片在线成人观看 | 亚洲国产成人精品无码区在线秒播 | 麻豆精品不卡国产免费看| 久久亚洲美女精品国产精品| 毛片免费观看视频| 极品美女一级毛片免费| 亚洲国产精品va在线播放| 国产精彩免费视频| AV激情亚洲男人的天堂国语| 亚洲乱码国产一区三区| 无码乱肉视频免费大全合集| 成年大片免费视频播放一级| 亚洲视频在线观看一区| A在线观看免费网站大全| 一个人看的www视频免费在线观看 一个人看的免费观看日本视频www | 免费高清在线爱做视频| eeuss影院免费直达入口| 亚洲天天做日日做天天看| 免费萌白酱国产一区二区| 久久久久久一品道精品免费看 | 曰批全过程免费视频网址|