電子，瀏覽器化后，fs.existsSync 不是函數
[英]electron, after browserify, fs.existsSync is not a function
問題描述
我閱讀了很多關於 browserify 和電子以及 gui 瀏覽器問題，但 browserify 仍然存在問題，說“fs.existsSync 不是一個函數”，“required 未定義”
*完整的故事*我用電子創建了簡單的gui，有package.json文件，main.js和index.html文件+ 3,4個html文件，我想在那里創建簡單的“加載顯示保存窗口”與要求一起工作
該功能在 index.html 文件中工作，但在 load.html 文件中無法正常工作，因此我使用命令瀏覽 main.js
var fs = require('electron') //console.log(require('fs').existsSync); var remote = require('electron').remote; // var remote = require('remote'); var dialog = require('electron').remote
進入 main.bundle3.js，用，（在 cmd 中）
browserify main.js > main.bundle3.js
然而然后 load.html 文件大喊 require 沒有定義和
> main.bundle3.js:6945 Uncaught TypeError: fs.existsSync is not a function
at Object.<anonymous> (main.bundle3.js:6945)
at Object.require.36.fs (main.bundle3.js:6951)
at s (main.bundle3.js:1)
at main.bundle3.js:1
at Object.<anonymous> (main.bundle3.js:6794)
at Object.require.35._process (main.bundle3.js:6937)
at s (main.bundle3.js:1)
at e (main.bundle3.js:1)
at main.bundle3.js:1
(anonymous) @ main.bundle3.js:6945
require.36.fs @ main.bundle3.js:6951
s @ main.bundle3.js:1
(anonymous) @ main.bundle3.js:1
(anonymous) @ main.bundle3.js:6794
require.35._process @ main.bundle3.js:6937
s @ main.bundle3.js:1
e @ main.bundle3.js:1
(anonymous) @ main.bundle3.js:1
包.json
{ "name": "RDF", "version": "0.1.0", "main": "main.js", "scripts": { "test": "mocha -u exports -R spec test/index" }, "devDependencies": { "electron": "^1.6.2", "electron-packager": "^8.6.0", "html-browserify": "0.0.6", "jquery": "^3.2.1" } }
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="https://cdn.plot.ly/plotly-latest.min.js"></script> <!--<script src="main.js"></script>--> <script src="main.bundle3.js"></script> <!-- <script type="text/javascript" src="main.js"></script> --> <script type="text/javascript" src="./lib/jquery-1.7.2.min.js"></script> </head> <body> <h3>LOAD</h3> <p>load the data</p> <!-- <input type="button" value="Details" onclick="javascript:$('#mainContainer').load('index.html');"/><br> <div id="mainContainer"> </div>--> <div id="tab33"> <div> <div style="text-align:center;"> <input type="text" placeholder="just select a file" id="actual-file" disabled="disabled"/> <input type="button" value="Choose a file" id="select-file"/> </div> <br><br> <textarea id="content-editor" rows="5"></textarea><br><br> <input type="button" id="save-changes" value="Save changes"/> <input type="button" id="delete-file" value="Delete file"/> </div> <hr> <div style="text-align:center;"> <p> he file content will be the same as the editor. </p> <input type="button" value="Choose a file" id="create-new-file"/> </div> <script> var fs = require('fs') var {remote} = require('electron').remote ; var {dialog} = require('electron').remote document.getElementById('select-file').addEventListener('click',function(){ dialog.showOpenDialog(function (fileNames) { if(fileNames === undefined){ console.log("No file selected"); }else{ document.getElementById('actual-file').value = fileNames[0]; readFile(fileNames[0], fileReadComplete); } }); },false); // document.getElementById('save-changes').addEventListener('click',function(){ var actualFilePath = document.getElementById("actual-file").value; if(actualFilePath){ saveChanges(actualFilePath,document.getElementById('content-editor').value); }else{ alert("just select a file first"); } },false); // document.getElementById('delete-file').addEventListener('click',function(){ var actualFilePath = document.getElementById("actual-file").value; if(actualFilePath){ deleteFile(actualFilePath); document.getElementById("actual-file").value = ""; document.getElementById("content-editor").value = ""; }else{ alert("just select a file first"); } },false); document.getElementById('create-new-file').addEventListener('click',function(){ var content = document.getElementById("content-editor").value; dialog.showSaveDialog(function (fileName) { if (fileName === undefined){ console.log("You didn't save the file"); return; } fs.writeFile(fileName, content, function (err) { if(err){ alert("An error ocurred creating the file "+ err.message) } alert("The file has been succesfully saved"); }); }); },false); function fileReadComplete(data) { myData = data; // Do whatever you want } function readFile(filepath, callback) { fs.readFile(filepath, 'utf-8', function (err, data) { if(err){ alert("An error ocurred reading the file :" + err.message); return; } callback(data); document.getElementById("content-editor").value = data; }); } function deleteFile(filepath){ fs.exists(filepath, function(exists) { if(exists) { // File exists deletings fs.unlink(filepath,function(err){ if(err){ alert("An error ocurred updating the file"+ err.message); console.log(err); return; } }); } else { alert("This file doesn't exist, cannot delete"); } }); } function saveChanges(filepath,content){ fs.writeFile(filepath, content, function (err) { if(err){ alert("An error ocurred updating the file"+ err.message); console.log(err); return; } alert("The file has been succesfully saved"); }); } </script> </div> <!-- <script data-main="main" src="require.js"></script>--> </body> </html>
完整的 main.js 文件
//console.log(require('fs')); console.log(require('module').globalPaths); const { electron } = require('electron'); const { BrowserWindow } = require('electron') const { app } = require('electron'); // @show(app) const path = require('path') //console.log( process.env.PATH); // (D:\\electron-v1.6.1-win32-x64\\resources\\default_app.asr\\main.js:325:5) //const BrowserWindow = require('browser-window') const url = require('url') var html = require('html-browserify'); var fs = require('electron') //console.log(require('fs').existsSync); var remote = require('electron').remote; // var remote = require('remote'); var dialog = require('electron').remote //dialog = require('electron').dialog //dialog =remote.require('dialog') //var load_=require('./load_.js') // broserify html var through = require('through'); var htmlclean = require('htmlclean'); module.exports = function(file, options) { options = options || {}; options.htmlclean = typeof options.htmlclean !== 'undefined' ? options.htmlclean : true; var buffer = ''; if (!/\\.(tpl|html)/.test(file)) { return through(); } else { return through(function(chunk) { return buffer += chunk.toString(); }, function() { var jst = buffer.toString(); if (options.htmlclean) { //options.htmlclean is truthy if (typeof options.htmlclean === 'object') { //options.htmlclean is an options object for the htmlclean module jst = htmlclean(jst, options.htmlclean); } else { //otherwise, clean using default options jst = htmlclean(jst); } } var compiled = 'module.exports = '; compiled += JSON.stringify(jst); compiled += ';\\n'; this.queue(compiled); return this.queue(null); }); } } //requirejs.config({ //By default load any module IDs from js/lib // baseUrl: 'js/lib', //except, if the module ID starts with "app", //load it from the js/app directory. paths //config is relative to the baseUrl, and //never includes a ".js" extension since //the paths config could be for a directory. //paths: { // app: ' ' //} //}); // Start the main app logic. //requirejs(['jquery', 'canvas', 'app/sub'], //function ($, canvas, sub) { //jQuery, canvas and the app/sub module are all //loaded and can be used here now. //}); //const fs = require('fs'); //const app = require('electron').app. //const remote = require('electron').remote; // be closed automatically when the JavaScript object is garbage collected. let win function createWindow() { // Create the browser window. win = new BrowserWindow({ width: 1050, height: 814 }) // and load the index.html of the app. win.loadURL(url.format({ pathname: path.join(__dirname, 'index.html'), protocol: 'file:', slashes: true })) // Open the DevTools. win.webContents.openDevTools() // Emitted when the window is closed. win.on('closed', () => { // Dereference the window object, usually you would store windows // in an array if your app supports multi windows, this is the time // when you should delete the corresponding element. win = null }) } // This method will be called when Electron has finished // initialization and is ready to create browser windows. // Some APIs can only be used after this event occurs. app.on('ready', createWindow) // Quit when all windows are closed. app.on('window-all-closed', () => { // On macOS it is common for applications and their menu bar // to stay active until the user quits explicitly with Cmd + Q if (process.platform !== 'darwin') { app.quit() } }) app.on('activate', () => { // On macOS it's common to re-create a window in the app when the // dock icon is clicked and there are no other windows open. if (win === null) { createWindow() } }) // In this file you can include the rest of your app's specific main process // code. You can also put them in separate files and require them here.
6 個解決方案
解決方案1
3 2017-05-28 19:42:16
該問題與require方法有關。 要修復它，您應該使用window.require 。
解決方案2
3 2017-06-15 15:30:03
如果您改為declare const window: any; 在您需要電子之前，您可以添加“窗口”。 到你的要求又名const {...} = window.require('electron')...;
解決方案3
2 2018-04-24 23:41:00
Browserify 忽略“fs”導入並在其位置返回一個空對象（請參見此處： https ://github.com/browserify/browserify-handbook#ignoring-and- exclude）。
您必須從 browserify 包中排除node_modules 模塊，如下所示：
gulp.task('default', () => {
var b = browserify('src/electron.js', {
debug: true,
ignoreMissing: true,
builtins: false,
commondir: false,
detectGlobals: false
});
b.exclude('fs'); // HERE
b.exclude('electron');
b.exclude('electron-updater');
b.exclude('electron-settings');
b.exclude('path');
b.exclude('url');
b.exclude('sqlite3');
b.exclude('express');
b.exclude('net');
b.exclude('body-parser');
b.bundle()
.pipe(source('electron.min.js'))
.pipe(buffer())
.pipe(uglify())
.pipe(gulp.dest('./src'));
});
現在您的應用程序將直接從 node_modules 獲取模塊而不是空對象。
解決方案4
1 2017-03-30 23:11:18
好的命令
npm install browserify-fs
然后
browserify -fs main.js >main.bundle.js
解決了“fs.existsSnc not a function”，但不是問題。 可能只是從問題中刪除 fs。 （提出這個的原因：該回復出現在關於 fs 和 browserify 的問題中）
解決方案5
1 已采納 2017-04-03 02:46:07
這個問題的概念解決方案：在“電子”中，
標簽中的“{dialog}=require(electron)”（例如，）將不起作用
這就是他們制造電子的方式。 可能是為了提高穩定性或只是基於 chrome 的問題的一部分
在主要過程中，我們可以要求（電子），在選項卡中，我們需要使用 browserify *** 檢查 npm 模塊，例如哪些模塊在電子中工作
解決方案6
0 2017-04-01 21:40:06
*** 技術解決方案是從 index.html 文件一個接一個地鏈接文件，其中每個文件都有與 require 一起使用的 js 文件
*** 錯誤“fs.existsSync 不是函數”是一般錯誤。 在沒有直接連接到主文件（index.html 和 main.js）的文件中出現 require() 問題的地方
*** 所有其他解決方案都失敗了（許多出現在 Internet 上來自 browserify、webpack、webview、requirejs 等）
Electron.js/Parcel 錯誤：fs.existsSync 不是 function
[英]Electron.js/Parcel Error: fs.existsSync is not a function
未處理的拒絕（TypeError）：fs.existsSync 不是函數
[英]Unhandled Rejection (TypeError): fs.existsSync is not a function
objects-to-csv TypeError: fs.existsSync 不是函數
[英]objects-to-csv TypeError: fs.existsSync is not a function
如何在fs.existsSync或statSync或readFileSync中使用通配符
[英]How to use wild card inside of fs.existsSync or statSync or readFileSync
為什么node.js`fs.existsSync`在包含在promise中時效果不佳？
[英]Why node.js `fs.existsSync` doesn't work well when wrapped in promise?
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.
相關問題
導入 electron 時 fs.existsSync 不是 function
Electron.js/Parcel 錯誤：fs.existsSync 不是 function
未處理的拒絕（TypeError）：fs.existsSync 不是函數
objects-to-csv TypeError: fs.existsSync 不是函數
捕獲節點fs.existsSync錯誤
當路徑有../時，fs.existsSync（）總是返回false
如何在fs.existsSync或statSync或readFileSync中使用通配符
Node.js：fs.existsSync 在 Heroku 上不起作用
node.js fs.existsSync 始終為 false
為什么node.js`fs.existsSync`在包含在promise中時效果不佳？
相關標簽