1. 程式人生 > >用electron打包vue專案中的報錯解決:

用electron打包vue專案中的報錯解決:

(原創,轉載請註明出處!)

這裡,也要提到實際專案中的問題,可能有同志的目錄結構和內容有些許差別,就我剛剛遇到的問題來說,常見的問題的有幾個問題,以及解決辦法如下:

1.  首先,一定要cd到專案的根目錄(我這裡是app)裡面才能執行專案,再重新npm run build,不然的話很有可能出現 “ 系統找不到路徑的問題 ”,成功的話會出現下面綠色的一串提示。

2.  接下來執行 “ npm run electron_build ”又出現如下報錯,

'electron' 不是內部或外部命令,也不是可執行的程式
或批處理檔案。
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! 
[email protected]
electron_dev: `electron build/electron.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the [email protected] electron_dev script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\milyyy\AppData\Roaming\npm-cache\_logs\2018-11-27T07_32_32_788Z-debug.log

或者 你運行了“ npm run build ” 也出現瞭如下報錯

D:\project\app>npm run build
npm ERR! file D:\project\app\package.json
npm ERR! code EJSONPARSE
npm ERR! JSON.parse Failed to parse json
npm ERR! JSON.parse Unexpected token / in JSON at position 392 while parsing near '...ev-server.js",
npm ERR! JSON.parse     // "build": "cross-e...'
npm ERR! JSON.parse Failed to parse package.json data.
npm ERR! JSON.parse package.json must be actual JSON, not just JavaScript.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\milyyy\AppData\Roaming\npm-cache\_logs\2018-11-27T07_33_47_083Z-debug.log

出現以上問題,很有可能說明了一個問題,那麼現在,我們再重新執行一下(再次強調在根目錄中)

npm install electron --save-dev

npm install electron-packager --save-dev

,這個時候如果再報錯,檢查一下我們app下的package.json檔案,裡面的內容如果是這樣:(先彆著急)

  "scripts": {
    "dev": "node build/dev-server.js",
    "start": "cross-env ENABLE_ESLINT=true node build/dev-server.js",
    "build": "cross-env ENABLE_ESLINT=true node build/build.js",
    "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
    "test": "npm run unit"
  },

很多人的script都進行過配置,那麼就跟著我做如下修改吧:

 "scripts": {
    "dev": "cross-env ENABLE_ESLINT=true node build/dev-server.js",
    "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
    "unit:watch": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --watch",
    "e2e": "node test/e2e/runner.js",
    "test": "npm run unit && npm run e2e",
    "build": "node build/build.js",        // *修改的*(很重要)
    "electron_dev": "electron build/electron.js",    // *修改的*
    "electron_build": "electron-packager ./dist/ --platform=win32 --arch=ia32  --icon=./src/assets/yizhu.ico  --overwrite"    // *修改的*
  },

最後,再次執行,

npm run electron_build

成功!

相關推薦

electron打包vue專案中的報解決

(原創,轉載請註明出處!) 這裡,也要提到實際專案中的問題,可能有同志的目錄結構和內容有些許差別,就我剛剛遇到的問題來說,常見的問題的有幾個問題,以及解決辦法如下: 1.  首先,一定要cd到專案的根目錄(我這裡是app)裡面才能執行專案,再重新npm run bui

web 專案中報解決,java.io.FileNotFoundException: druid.properties (系統找不到指定的檔案);【spring工廠解耦開發】

使用 Tomcat9.0 ,   spring5.0框架原始工廠類解耦,druid-1.0.9jar版本,JDK9,MSQL8版本資料庫  模擬web頁面登入案例時候出現druid.properties

HBuilderX 打包 vue 專案 為 App 的步驟

首先打包你的 vue 專案 生成 dist 資料夾,教程請移步  https://www.cnblogs.com/taohuaya/p/10256670.html 看完上面的教程,請確保 你是 將: 專案目錄下的co

「webpack工程師」 webpack4 打包vue前端多頁面專案

之前一直用的腳手架,這次自己搭建webpack前端專案,花費了不少心思,於是做個總結。 WebPack可以看做是模組打包機:它做的事情是,分析你的專案結構,找到JavaScript模組以及其它的一些瀏覽器不能直接執行的拓展語言(Scss,TypeScript

通過vue-cli生成專案時報解決方案

全域性安裝 vue-cli $ npm install -g vue-cli 建立一個基於 “webpack” 模板的新專案 $ vue init webpack my-project 在執行vue init webpack my-project時遇到一個錯

關於webpack打包vue專案在GitHubPage上不顯示的解決方法

正文開始 1正常的vue專案打包後放在GitHubPage上是不顯示的 2這時需要在package.json同級目錄下建立可選檔案vue.config.js 3在vue.config.js中寫入如下程式碼 module.exports = { baseU

vue init webpack 建vue專案解決方法

vue init webpack my-project   C:\Users\computer\AppData\Roaming\npm\node_modules\vue-cli\bin\vue-init:60 let template = program.args[0] ^

專案中報Warning: count():Parameter must be an array or an object that implements Countable的解決方案

報錯資訊:Warning: count(): Parameter must be an array or an object that implements Countable 這主要是7.2版本更新,部分方法變得更加嚴謹了 當傳遞一個無效引數的時候,count()函式會丟擲warning的警告

vue專案中報有關eslint的,關閉eslint

Errors: 4 http://eslint.org/docs/rules/semi 4 http://eslint.org/docs/rules/quotes 3 http://eslint.org/docs/rules/ 我在執行vue專案的時候終

Cordova將vue專案打包成app

1.配置安卓環境 (1)下載JDK和JRE,安裝(通常JDK會整合JRE,所以只需安裝JDK就好)JDK一定要是 8 版本(JDK1.8),Down了個10版本的差點配到吐也沒成功,這是個驚天神坑 (2)下載Android  SDK,雙擊安裝,複製下安裝目錄 (3)

Pyinstaller打包Scrapy專案問題解決!!!(轉載)

使用Pyinstaller打包Scrapy專案的時候遇到各種坑,首先感謝La_vie_est_belle分享的文章,給了很大的幫助。結合他的分享我稍微整理一下。遇到的最難的坑,文末有提到。轉載地址:https://blog.csdn.net/la_vie_est_belle/

npm 安裝過程中報解決

mar 技術 ado pan sys word sim line sans 安裝:npm install -g truffle下述錯誤解決方式:npm config set strict-ssl falsenpm 安裝過程中報錯解決

webpack 建立 vue 專案

    1、安裝支援webpack 包 npm i -D  webpack webpack-cli  aspnet-webpack webpack-dev-middleware  webpack-hot-middleware 

vue init webpack 建vue專案

首先我們用vue-cli新建專案。 全域性安裝vue-cli npm install -g vue-cli 建立一個名字為demo的專案。 vue init webpack demo 結果報錯了,錯誤如下:

vue eslint報解決辦法

overlay formatter form emit tel erl ORC bubuko 解決辦法 若提示入下圖時,在build / webpack.base.conf.js中, 找到 // const createLintingRule = () => ({//

Cordova打包Vue專案成APK

在打包之前,確保環境安裝成功,各方面都沒有錯誤,不然會吃很多苦頭,關於其他的環境安裝在另外一篇文章中記錄。本文中所有操作皆是在vscode中操作。 建立cordova工程,不然打包的時候會報當前目錄不是一個Cordova專案: 其中hello是目錄名字,org.single.

ionic3 ionic start建立專案解決方案

文章來至:http://www.ionic.wang/article-index-id-128.html 1.首先 ionic start建立專案的時候剛開始就遇到錯誤(沒有生成檔案)第一種錯誤 ionic start ionicdemo tabs 執行這個命令以後報以下錯誤

cordava打包vue專案成app

注意:安裝目錄不要以中文命名 1.安裝cordova :npm install -g cordova 2.安裝java jdk :配置環境變數:      1.系統變數:名:JAVA_HOME    值:C:\Program Files\Java\jdk

webpack 打包vue專案後生成一個可修改介面地址的配置檔案。

當我們做完vue專案打包、轉測試、部署後,卻遇到修改介面地址,或修改域名。但是在npm run build 之後所生成的 dist 檔案也是寫死的了。我們就需要回來重新修改,重新打包。 no no no 一想都覺得麻煩哎。 所以最好解決方案就是有個 config 檔案方便我們管理這些。 解決

SSH專案解決辦法

遇到最常見的問題: JAVA web專案中的no result defined for action result input 錯誤 產生這個錯誤的原因:Action中的屬性值為空的時候,Struts2的預設攔截器會報錯,但是又找不到input的Result,不