我读了很多关于browserify和电子以及gui浏览器的问题
但是浏览器仍然存在问题,说“fs.existsSync不是函数”,“必需未定义”
*全文*
我用电子创造了简单的gui,
有package.json文件,main.js和index.html文件3,4 html文件,在那里我想创建简单的“加载显示保存窗口”,使用require
该功能在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文件喊出要求不是定义和
> 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
package.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"
}
}和load.html文件
<!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.解决方法:
如果您改为声明const窗口：any;在您需要电子之前,您可以添加“窗口”.你的要求又名const {…} = window.require(‘electron’)…;
原文地址：https://codeday.me/bug/20190727/1552423.html
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。