рдирдорд╕реНрддреЗ
рдореИрдВ рдЕрдиреНрдп рдкреНрд▓рдЧрдЗрдиреНрд╕ (рдиреАрдЪреЗ рд╕реВрдЪреА) рдХреЗ рдмреАрдЪ, React.js рдФрд░ babelify рдХреЗ рд╕рд╛рде рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред
рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП require('electron')
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕, рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ BrowserWindow
рддрдХ рдкрд╣реБрдВрдЪ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП, рдХрдВрд╕реЛрд▓ рдореЗрдВ рдкрд░рд┐рдгрд╛рдо рдирд┐рдореНрди рддреНрд░реБрдЯрд┐ рджрд┐рдЦрд╛ рд░рд╣рд╛ рд╣реИ:
index.js:4 Uncaught TypeError: fs.readFileSync is not a function
рд╣рд╛рд▓рд╛рдВрдХрд┐, рдореИрдВ main.js рдореЗрдВ const electron = require('electron');
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддрд╛ рд╣реВрдВред рдЗрд╕рдХреЗ рд▓рд╛рдпрдХ рдХреНрдпрд╛ рд╣реИ, рдореИрдВ рд╕рдм рдХреБрдЫ рдПрдХ рдЬреЗрдПрд╕ рдмрдВрдбрд▓ рдореЗрдВ рдкреИрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП watchify рдХрд╛ рднреА рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред
рдореЗрд░реЗ package.json рдореЗрдВ рдирд┐рд░реНрднрд░рддрд╛ рдХреА рдкреВрд░реА рд╕реВрдЪреА рдпрд╣рд╛рдВ рджреА рдЧрдИ рд╣реИ:
"devDependencies": {
"axios": "^0.9.1",
"babel-preset-es2015": "^6.6.0",
"babel-preset-react": "^6.5.0",
"babelify": "^7.2.0",
"classnames": "^2.2.3",
"electron": "^1.3.5",
"electron-reload": "^0.2.0",
"jquery": "^2.2.3",
"react": "^0.14.8",
"react-autocomplete": "^1.0.0-rc2",
"react-dom": "^0.14.7",
"react-sound": "^0.4.0",
"soundmanager2": "^2.97.20150601-a"
},
index.js:4 рдЕрдирдХреЙрдЯреЗрдб рдЯрд╛рдЗрдк рдПрд░рд░: fs.readFileSync рдПрдХ рдлрдВрдХреНрд╢рди рдирд╣реАрдВ рд╣реИ
рдХреНрдпрд╛ рдЖрдк рдпрд╣рд╛рдВ index.js
рдХреА рдкрдВрдХреНрддрд┐ 4 рд╢рд╛рдорд┐рд▓ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ? рдпрд╛ рдПрдХ рдлреБрд▓рд░ рд╕реНрдЯреИрдХ рдЯреНрд░реЗрд╕?
рдореЗрд░рд╛ рдорд╛рдирдирд╛ тАЛтАЛрд╣реИ рдХрд┐ рдпрд╣ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ index.js рдХреА рдмрд╛рдд рдХрд░ рд░рд╣рд╛ рд╣реИ, рдЬреЛ рд╕реНрд╡рдпрдВ рдкрд░рд┐рдпреЛрдЬрдирд╛ рдХреЗ рдиреЛрдб-рдореЙрдбреНрдпреВрд▓ рдореЗрдВ рд╕реНрдерд┐рдд рд╣реИред рдпрд╣рд╛рдБ рдЗрд╕ рдлрд╝рд╛рдЗрд▓ рдХреА рд╕рд╛рдордЧреНрд░реА рд╣реИ:
var fs = require('fs')
var path = require('path')
module.exports = path.join(__dirname, fs.readFileSync(path.join(__dirname, 'path.txt'), 'utf-8'))
рд╕рдВрдкреВрд░реНрдг рд╕реНрдЯреИрдХ рдЯреНрд░реЗрд╕ React.js рдХреЗ рд╕рд╛рде рд╕рдВрдШрд░реНрд╖ рдХрд╛ рд╕реБрдЭрд╛рд╡ рджреЗрддрд╛ рд╣реИ:
рдпрджрд┐ рдЖрдк рджреЗрд╡ рдЙрдкрдХрд░рдг рдХреЗ рдХрдВрд╕реЛрд▓ рдЯреИрдм рд╕реЗ require('fs').readFileSync
рдЪрд▓рд╛рддреЗ рд╣реИрдВ рддреЛ рдХреНрдпрд╛ рд╣реЛрдЧрд╛?
рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ electron-prebuilt
рдиреЛрдб рдореЙрдбреНрдпреВрд▓ (рдЖрдкрдХреЗ рджреНрд╡рд╛рд░рд╛ рдЪрд┐рдкрдХрд╛рдИ рдЧрдИ рдлрд╝рд╛рдЗрд▓) рдЖрдкрдХреЗ рдкреИрдХ рдХрд┐рдП рдЧрдП рдРрдк рдореЗрдВ рд╕рдорд╛рдкреНрдд рд╣реЛ рд░рд╣рд╛ рд╣реИ, рдЬреЛ рдореБрдЭреЗ рдирд╣реАрдВ рд▓рдЧрддрд╛ рдХрд┐ рдЖрдк рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдЗрд╕рдХреЗ рдмрдЬрд╛рдп рдЕрдВрддрд░реНрдирд┐рд╣рд┐рдд electron
рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПред
@nukeop рдЖрдк рдЕрдкрдирд╛ рдРрдк рдХреИрд╕реЗ рд▓реЙрдиреНрдЪ рдХрд░ рд░рд╣реЗ рд╣реИрдВред рдЖрдкрдХреА 'рд╕реНрдЯрд╛рд░реНрдЯ рд╕реНрдХреНрд░рд┐рдкреНрдЯ' рдЗрд╕ рддрд░рд╣ рджрд┐рдЦрдиреА рдЪрд╛рд╣рд┐рдПред
"scripts": {
"start": "electron ."
}
рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЖрдк рдиреЛрдб рдХреЗ рд╕рд╛рде рдЕрдкрдирд╛ main.js
рдЪрд▓рд╛рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░ рд░рд╣реЗ рд╣реИрдВ
node main.js
рдЬреЛ рдХрд╛рдо рдирд╣реАрдВ рдХрд░реЗрдЧрд╛
рдпрджрд┐ рдЖрдк рдбреЗрд╡ рдЯреВрд▓реНрд╕ рдХреЗ рдХрдВрд╕реЛрд▓ рдЯреИрдм рд╕реЗ requ('fs').readFileSync рдЪрд▓рд╛рддреЗ рд╣реИрдВ рддреЛ рдХреНрдпрд╛ рд╣реЛрддрд╛ рд╣реИ?
рдЗрд╕ рддреНрд░реБрдЯрд┐ рдХреЛ рдлреЗрдВрдХрдиреЗ рдХреЗ рдареАрдХ рдмрд╛рдж, рдореИрдВ рдлрд╝рдВрдХреНрд╢рди рдХреА рдкрд░рд┐рднрд╛рд╖рд╛ рдореБрджреНрд░рд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрдВрд╕реЛрд▓ рдореЗрдВ require('fs').existsSync
рдЪрд▓рд╛рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реВрдВред рдпрд╣ рддреНрд░реБрдЯрд┐ рд╕реЗ рдкрд╣рд▓реЗ рднреА рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред
рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди-рдкреНрд░реАрдмрд┐рд▓реНрдЯ рдиреЛрдб рдореЙрдбреНрдпреВрд▓ (рдЖрдкрдХреЗ рджреНрд╡рд╛рд░рд╛ рдЪрд┐рдкрдХрд╛рдИ рдЧрдИ рдлрд╝рд╛рдЗрд▓) рдЖрдкрдХреЗ рдкреИрдХреЗрдЬреНрдб рдРрдк рдореЗрдВ рд╕рдорд╛рдкреНрдд рд╣реЛ рд░рд╣рд╛ рд╣реИ, рдЬреЛ рдореБрдЭреЗ рдирд╣реАрдВ рд▓рдЧрддрд╛ рдХрд┐ рдЖрдк рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдЗрд╕рдХреЗ рдмрдЬрд╛рдп рдмрд┐рд▓реНрдЯ-рдЗрди рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПред
рдореЗрд░реЗ рдкрд╛рд╕ рдкреГрд╖реНрдарднреВрдорд┐ рдореЗрдВ рдЪрд▓ рд░рд╣рд╛ рдПрдХ рдШрдбрд╝реА рдЙрджрд╛рд╣рд░рдг рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдореИрдВ рд╡рд┐рдХрд╛рд╕ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдЬреЛ рд▓рдЧрд╛рддрд╛рд░ рдореЗрд░реЗ рдкреИрдХреЗрдЬ рдХреЛ рдЕрдкрдбреЗрдЯ рдХрд░ рд░рд╣рд╛ рд╣реИред рдореИрдВрдиреЗ рдЗрд╕реЗ package.json рдХреЗ рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╕реЗрдХреНрд╢рди рдореЗрдВ рдЗрд╕ рддрд░рд╣ рдкрд░рд┐рднрд╛рд╖рд┐рдд рдХрд┐рдпрд╛ рд╣реИ:
"watch": "watchify app/app.js -t babelify -o public/js/bundle.js --debug --verbose"
electron-prebuilt
рдХреЛ рдмрдВрдбрд▓ рдХрд░рдиреЗ рд╕реЗ рдмрдЪрдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреЛрдИ рд╕рд▓рд╛рд╣?
@nukeop рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдЖрдВрддрд░рд┐рдХ рд░реВрдк рд╕реЗ рдЖрд╡рд╢реНрдпрдХрддрд╛ рдХрд╛ рд╕рдорд░реНрдерди рдХрд░рддрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдЖрдкрдХреЛ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИред
рдЬрд╣рд╛рдВ рддрдХ тАЛтАЛтАЛтАЛрдореБрдЭреЗ рдкрддрд╛ рд╣реИ, рдореИрдВ рдЪрд╛рд╣рддрд╛ рд╣реВрдВ рдХрд┐ рдЖрдк рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ, рдЖрдкрдХреЛ "рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди" рдХреЛ рдмрд╛рд╣рд░ рдХрд░рдирд╛ рд╣реЛрдЧрд╛ред
рджрд┐рд▓рдЪрд╕реНрдк рд╣реИ, рдХреНрдпрд╛ рдРрд╕рд╛ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рдХрд┐ watchify/browserify рдЗрд╕реЗ рдмрд░реНрдмрд╛рдж рдХрд░ рд░рд╣рд╛ рд╣реИ? рдЗрд╕рдиреЗ рдЕрдм рддрдХ рдареАрдХ рдХрд╛рдо рдХрд┐рдпрд╛ рд╣реИред
рдЕрдм рдореБрдЭреЗ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдЗрд╕рдХреЗ рдмрд┐рдирд╛ рдкреНрд░реЛрдЧреНрд░рд╛рдо рдХреИрд╕реЗ рдЪрд▓рд╛рдпрд╛ рдЬрд╛рдПред
рд╕рдЪрдореБрдЪ рдмрд╕ рднрд╛рдЧреЛ
electron .
рдЕрдкрдиреЗ рдореБрдЦреНрдп рдРрдк рдлрд╝реЛрд▓реНрдбрд░ рд╕реЗ, рдЖрдкрдХреЛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп рдХреБрдЫ рднреА рдмрдВрдбрд▓ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдЗрд╕рдореЗрдВ рдЖрдВрддрд░рд┐рдХ рд░реВрдк рд╕реЗ рдПрдХ рдкреВрд░реНрдг рдиреЛрдб рд╡рд╛рддрд╛рд╡рд░рдг рд╣реИред
_рдореИрдВ рдЗрд╕реЗ рдмрдВрдж рдХрд░рдиреЗ рдЬрд╛ рд░рд╣рд╛ рд╣реВрдВ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдПрдХ Browserify рд╕рдорд╕реНрдпрд╛ рд╣реИ_
рдкреНрд░реЛрдЧреНрд░рд╛рдо рдХреЛ рдПрдХ .js рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рдкреИрдХ рдХрд░рдХреЗ, рдЬреЛ рдПрдХ рд╕рд╛рдзрд╛рд░рдг html рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рд╢рд╛рдорд┐рд▓ рд╣реИ, рдореИрдВ рдпрд╣реА рд╕рдм рдХрд░ рд░рд╣рд╛ рд╣реВрдБ:
<script src="public/js/bundle.js">
</script>
рдФрд░ рд╕рдм рдХреБрдЫ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ, рд╕рд┐рд╡рд╛рдп рдЗрд╕рдХреЗ рдХрд┐ рдЬрдм рдореИрдВ рдЖрд╡рд╢реНрдпрдХрддрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВред рдпрд╣ рджреЛ рдореЙрдбреНрдпреВрд▓ рдХреЗ рдмреАрдЪ рдмрд╛рддрдЪреАрдд рдХреЗ рд╕рд╛рде рдПрдХ рд╕рдорд╕реНрдпрд╛ рд╣реИред
рдЕрдЧрд░ рдореИрдВ рдкреВрд░реЗ рдкреНрд░реЛрдЧреНрд░рд╛рдо рдХреЛ рдмрдВрдбрд▓ рдореЗрдВ рдкреИрдХ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдореЗрд░реЗ рдкрд╛рд╕ рдЗрд╕реЗ рдЪрд▓рд╛рдиреЗ рдХрд╛ рдХреЛрдИ рдЖрд╕рд╛рди рддрд░реАрдХрд╛ рдирд╣реАрдВ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рдореЗрд░рд╛ main.js рдХреЗрд╡рд▓ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╢реБрд░реВ рдХрд░рддрд╛ рд╣реИ рдФрд░ рдПрдЪрдЯреАрдПрдордПрд▓ рдлрд╛рдЗрд▓ рдХреЛ рд▓реЛрдб рдХрд░рддрд╛ рд╣реИ рдЬрд┐рд╕рдореЗрдВ рдмрдВрдбрд▓ рд╢рд╛рдорд┐рд▓ рд╣реИред
@nukeop рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рдЕрдВрджрд░ рд░реЗрдВрдбрд░рд░ рдкреНрд░рдХреНрд░рд┐рдпрд╛ рдХреЗ рдкрд╛рд╕ рдкреВрд░реНрдг рдиреЛрдб/рд╕рд╛рдорд╛рдиреНрдп рд╡рд╛рддрд╛рд╡рд░рдг рддрдХ рдкрд╣реБрдВрдЪ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдЖрдкрдХреЛ рдХреБрдЫ рднреА рдмрдВрдбрд▓ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИред
рдЕрдЧрд░ рдореИрдВ рдкреВрд░реЗ рдкреНрд░реЛрдЧреНрд░рд╛рдо рдХреЛ рдмрдВрдбрд▓ рдореЗрдВ рдкреИрдХ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдореЗрд░реЗ рдкрд╛рд╕ рдЗрд╕реЗ рдЪрд▓рд╛рдиреЗ рдХрд╛ рдХреЛрдИ рдЖрд╕рд╛рди рддрд░реАрдХрд╛ рдирд╣реАрдВ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рдореЗрд░рд╛ main.js рдХреЗрд╡рд▓ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╢реБрд░реВ рдХрд░рддрд╛ рд╣реИ рдФрд░ рдПрдЪрдЯреАрдПрдордПрд▓ рдлрд╛рдЗрд▓ рдХреЛ рд▓реЛрдб рдХрд░рддрд╛ рд╣реИ рдЬрд┐рд╕рдореЗрдВ рдмрдВрдбрд▓ рд╢рд╛рдорд┐рд▓ рд╣реИред
рдореБрдЭреЗ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдореИрдВ рдпрд╣рд╛рдВ рд╕рдордЭрддрд╛ рд╣реВрдВ, рдЖрдкрдХреА HTML рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рдЖрдкрдХреЗ рджреНрд╡рд╛рд░рд╛ рд▓реЛрдб рдХреА рдЧрдИ рдХрд┐рд╕реА рднреА рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдореЗрдВ рдПрдХ рдкреВрд░реНрдг рд╕рд╛рдорд╛рдиреНрдп рд╡рд╛рддрд╛рд╡рд░рдг рд╣реИ рдФрд░ рдЗрд╕рд▓рд┐рдП рдХреБрдЫ рднреА рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХрд┐рдП рдмрд┐рдирд╛ рдЕрддрд┐рд░рд┐рдХреНрдд рдлрд╝рд╛рдЗрд▓реЛрдВ рдореЗрдВ рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП require
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддрд╛ рд╣реИ
рднрд╡рд┐рд╖реНрдп рдореЗрдВ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рд╛рдордирд╛ рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рдФрд░ рдЗрд╕ рдзрд╛рдЧреЗ рдХреЛ рдкрдврд╝рдиреЗ рд╡рд╛рд▓реЗ рдХрд┐рд╕реА рднреА рд╡реНрдпрдХреНрддрд┐ рдХреЗ рд▓рд┐рдП, рдЖрд╡рд╢реНрдпрдХрддрд╛ рдХреЗ рдмрдЬрд╛рдп window.require
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдФрд░ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХреЗ require
рдлрд╝рдВрдХреНрд╢рди рдХреЗ рдмреАрдЪ рд╕рдВрдШрд░реНрд╖ рд╕реЗ рдмрдЪрдиреЗ рдХреА рдПрдХ рд╕рдВрднрд╛рд╡рдирд╛ рд╣реИред
рдПрдлрдбрдмреНрд▓реНрдпреВрдЖрдИрдбрдмреНрд▓реНрдпреВ, рдореИрдВ рдЙрд╕реА рдореБрджреНрджреЗ рдореЗрдВ рднрд╛рдЧ рдЧрдпрд╛ рдЬрд┐рд╕рдореЗрдВ рдХреНрд░рд┐рдПрдЯ-рд░рд┐рдПрдХреНрд╢рди-рдРрдк рдХреЗ рд╕рд╛рде рд░реЗрдВрдбрд░рд░ рдкреНрд░рдХреНрд░рд┐рдпрд╛ рдореЗрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХреА рдЬрд╛ рд░рд╣реА рд╣реИ рдЬреЛ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХреЗ рдмрдЬрд╛рдп рдмреИрдХрдПрдВрдб рдореЗрдВ рд╡реЗрдмрдкреИрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реИред window.require
рдореЗрд░реЗ рд▓рд┐рдП рднреА рдЗрд╕реЗ рд╣рд▓ рдХрд░рдиреЗ рд▓рдЧрддрд╛ рд╣реИ, рд╣рд╛рд▓рд╛рдВрдХрд┐ рдореИрдВ рдкреВрд░реА рддрд░рд╣ рд╕реЗ рд╕реНрдкрд╖реНрдЯ рдирд╣реАрдВ рд╣реВрдВ рдХрд┐ рдХреНрдпреЛрдВред
рд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ : рдореБрдЭреЗ рдкрддрд╛ рдЪрд▓рд╛ рдХрд┐ рдХреНрдпреЛрдВ :-) рд╣рдо рд░рдирдЯрд╛рдЗрдо рдХреЗ рджреМрд░рд╛рди require
electron
рдЪрд╛рд╣рддреЗ рд╣реИрдВ, рдЬреЛ рдХрд┐ рд╡реЗрдмрдкреИрдХ рджреНрд╡рд╛рд░рд╛ рд╕рдВрдХрд▓рди рдХреЗ рджреМрд░рд╛рди рдЙрдкрдпреЛрдЧ рдХрд┐рдП рдЬрд╛рдиреЗ рд╡рд╛рд▓реЗ рдиреЛрдбрдЬ рд╡рд╛рддрд╛рд╡рд░рдг рдХреЗ рдмрдЬрд╛рдп рд░рдирдЯрд╛рдЗрдо рдкрд░ рдкреНрд░рджрд╛рди рдХрд┐рдП рдЧрдП рдиреЛрдбрдЬ рд╡рд╛рддрд╛рд╡рд░рдг рд╕реЗ рд╣реЛрддрд╛ рд╣реИред рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ, рдЧреНрд▓реЛрдмрд▓реНрд╕ window
рдХреЗ рд▓рд┐рдП рдмрд╛рдзреНрдп рд╣реИрдВ рдФрд░ рд╡реЗрдмрдкреИрдХ рд╕рдВрдХрд▓рди window
рд╡реИрд╢реНрд╡рд┐рдХ рдХреА рдЙрдкреЗрдХреНрд╖рд╛ рдХрд░рддрд╛ рд╣реИ - рдЗрд╕рд▓рд┐рдП window.require
рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред
рд╡реЗрдмрдкреИрдХ рдХреЛ рд╡реИрд╢реНрд╡рд┐рдХ рдирд╛рдо рдХреЛ рдирдЬрд╝рд░рдЕрдВрджрд╛рдЬрд╝ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд╣рдиреЗ рдХрд╛ рдПрдХ рдЕрдиреНрдп рддрд░реАрдХрд╛ рдЬреЗрдПрд╕ рдлрд╝рд╛рдЗрд▓ рдореЗрдВ /*global Android*/
рдЬреИрд╕реА рдЯрд┐рдкреНрдкрдгреА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рд╣реИред рдПрдВрдбреНрд░реЙрдЗрдб рд╡реЗрдмрд╡реНрдпреВ рдореЗрдВ рд╕реАрдЖрд░рдП рдирд┐рд░реНрдорд┐рдд рдРрдк рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реБрдП рдПрдХ рдЕрдиреНрдп рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдореЗрдВ, рдореИрдВрдиреЗ рд╡реЗрдмрд╡реНрдпреВ рджреНрд╡рд╛рд░рд╛ рдкреНрд░рджрд╛рди рдХрд┐рдП рдЧрдП рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдЗрдВрдЯрд░рдлреЗрд╕ рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдЬреЗрдПрд╕ рдХреЗ рд╕рдВрдкрд░реНрдХ рдореЗрдВ рдЖрдиреЗ рд╡рд╛рд▓реЗ рдЬрд╛рд╡рд╛ рдСрдмреНрдЬреЗрдХреНрдЯ рддрдХ рдкрд╣реБрдВрдЪ рдкреНрд░рд╛рдкреНрдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЙрдкрд░реЛрдХреНрдд рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ред
@nukeop - рдЖрдкрдХреА рдЖрдЦрд┐рд░реА рдкреЛрд╕реНрдЯ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж; рдЗрд╕рдиреЗ рдореЗрд░реА рдмрд╣реБрдд рдорджрдж рдХреАред window.require
рдиреЗ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛ред
рд╣рд╛рдБ, рдореЗрд░реЗ рдирд┐рд░реНрдорд╛рдг рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдРрдк/рд╡реЗрдмрдкреИрдХ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдареАрдХ рдХрд░ рджрд┐рдпрд╛ред
рдкрд░рд┐рд╡рд░реНрддрди
import electron, { ipcRenderer } from 'electron'
рдкреНрд░рддрд┐
const electron = window.require("electron")
@ рд╢реНрд░реАрдирд╛рде рдЖрдк рдЕрдкрдиреЗ рд╕реАрдЖрд░рдП рдРрдк рдХреЛ рдЕрдкрдиреЗ рдореБрдЦреНрдп рдореЗрдВ рд░реЗрдВрдбрд░рд░ рдХреЗ рд░реВрдк рдореЗрдВ рдХреИрд╕реЗ рдЙрдЬрд╛рдЧрд░/рд▓реЛрдб рдХрд░ рд░рд╣реЗ рд╣реИрдВ? рдХреНрдпрд╛ рдЖрдк рдкрд╣рд▓реЗ рдирд┐рд░реНрдорд╛рдг рдХрд░ рд░рд╣реЗ рд╣реИрдВ (рдФрд░ HTML рд╕реНрдерд┐рд░ рд╕рдВрд╕рд╛рдзрди рдкрдереЛрдВ рдХреЛ рд╕рдВрд╢реЛрдзрд┐рдд рдХрд░ рд░рд╣реЗ рд╣реИрдВ)
рд╣рд╛рдБ рдореЗрд░рд╛ рд╡рд░реНрдХрдлрд╝реНрд▓реЛ рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдореВрд▓ рд░реВрдк рд╕реЗ CRA рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ npm run build
рдЪрд▓рд╛рдирд╛ рд╣реИ рдФрд░ рдлрд┐рд░ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рд╕рд╛рде build
рдлрд╝реЛрд▓реНрдбрд░ рдореЗрдВ рдЖрдЙрдЯрдкреБрдЯ рдЪрд▓рд╛рдирд╛ рд╣реИред рдЖрдкрдХреЛ рд╕реНрдерд┐рд░ рд╕рдВрд╕рд╛рдзрди рдкрдереЛрдВ рдХреЛ рд╣рд╛рде рд╕реЗ рд╕рдВрд╢реЛрдзрд┐рдд рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИред рд╕реАрдЖрд░рдП рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХреЗ рд▓рд┐рдП package.json
рдореЗрдВ, рдЖрдкрдХреЛ рдмрд╕ homepage
рдХреЛ рдЗрд╕ рддрд░рд╣ рд╕реЗрдЯ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ рдФрд░ рдкрде рдЙрдЪрд┐рдд рд░реВрдк рд╕реЗ рд╕реЗрдЯ рд╣реЛ рдЬрд╛рдПрдВрдЧреЗред
"homepage": "./"
рдЗрд╕рдХреЗ рдЕрддрд┐рд░рд┐рдХреНрдд, рдореЗрд░реЗ рдкрд╛рд╕ $ public
рдлрд╝реЛрд▓реНрдбрд░ рдореЗрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдРрдк рдХреЗ рд▓рд┐рдП main.js
рдФрд░ package.json
рд╣реИред рдЗрд╕рд▓рд┐рдП рдмрд┐рд▓реНрдб рдХреЛ рдЪрд▓рд╛рдирд╛ рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рд░реВрдк рд╕реЗ рдЙрдиреНрд╣реЗрдВ рдХреЙрдкреА рдХрд░ рд▓реЗрддрд╛ рд╣реИ рдФрд░ рдЖрдк рдЕрдкрдирд╛ рдРрдк рд╢реБрд░реВ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдмрд╕ electron build/
рдЪрд▓рд╛ рд╕рдХрддреЗ рд╣реИрдВред
рдореИрдВ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рд╡рд┐рдХрд╛рд╕ рдХреЗ рд▓рд┐рдП рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рд╕рд╛рде npm start
рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рд╣реЛрдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рдпрд╣ рдкрддрд╛ рдирд╣реАрдВ рдЪрд▓рд╛ рд╣реИ рдХрд┐ рдпрд╣ рдХрд╛рдо рдХреИрд╕реЗ рдХрд┐рдпрд╛ рдЬрд╛рдПред рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореБрдЭреЗ eject
рдХрд░рдирд╛ рд╣реЛрдЧрд╛ рдФрд░ рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХреЛ рд╣рд╛рде рд╕реЗ рд╕рдВрд╢реЛрдзрд┐рдд рдХрд░рдирд╛ рд╣реЛрдЧрд╛ред
рдпрджрд┐ рдЖрдк рд╕реЗрдЯрдЕрдк рдХрд╛ рдПрдХ рдЙрджрд╛рд╣рд░рдг рджреЗрдЦрдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ - https://github.com/srinathh/snippetfu рдкрд░ рдПрдХ рдирдЬрд╝рд░ рдбрд╛рд▓реЗрдВ
рдореИрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдиреЛрдб-рд╡реЗрдмрдХрд┐рдЯ (nw.js)ред
window.require
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рд╕реЗ рдореЗрд░реА рд╕рдорд╕реНрдпрд╛ рднреА рдареАрдХ рд╣реЛ рдЧрдИред рдЗрд╕рдХреЗ рд▓рд┐рдП рдмрд╣реБрдд - рдмрд╣реБрдд рдзрдиреНрдпрд╡рд╛рдж!
@nukeop window.require
рдиреЗ рдореЗрд░реЗ рд▓рд┐рдП рднреА рдЯреНрд░рд┐рдХ рдХреА рдФрд░ рд╕рд╛рде рд╣реА рдмрд╣реБрдд-рдмрд╣реБрдд рдзрдиреНрдпрд╡рд╛рдж! рдореИрдВ
@nukeop рдореБрдЭреЗ рдПрдХ рд╣реА рддреНрд░реБрдЯрд┐ рдорд┐рд▓реА, рд▓реЗрдХрд┐рди рдпрд╣ рд╡рд┐рдВрдбреЛ рд╣рд▓ рд╣реЛ рдЧрдИ рд╣реИред рдЪрд╛рд▓ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ, рдмрд╣реБрдд рдмрд╣реБрдд рдзрдиреНрдпрд╡рд╛рдж!
window.require
рдиреЗ fs.existsSync is not a function
рдХреЗ рдореБрджреНрджреЗ рдХреЛ рд╣рд▓ рдХрд┐рдпрд╛ рд▓реЗрдХрд┐рди рдЗрд╕рд╕реЗ рдПрдХ рдФрд░ рддреНрд░реБрдЯрд┐ рд╣реБрдИ: window.require
рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдирд╣реАрдВ рд╣реИред рдореИрдВ рдЗрд╕реЗ рдХреИрд╕реЗ рд╣рд▓ рдХрд░реВрдВ?
@ steric85 рдХреНрдпрд╛ рдЖрдк рдмреНрд░рд╛рдЙрдЬрд╝рд░реАрдлрд╛рдИ, рдмреЗрдмреЗрд▓ рдпрд╛ рд╡реЗрдмрдкреИрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реЗ рд╣реИрдВ? рдЖрдкрдХреЛ рдЕрдкрдирд╛ рдХреЛрдб рдЯреНрд░рд╛рдВрд╕рдкрд╛рдЗрд▓ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛ рд╕рдХрддреА рд╣реИ
@Alxmerino рдореИрдВ рд╡реЗрдмрдкреИрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред
рд╕реБрдирд┐рд╢реНрдЪрд┐рдд рдХрд░реЗрдВ рдХрд┐ рдЖрдк рдЕрдкрдирд╛ рдХреЛрдб рд╕рдВрдХрд▓рд┐рдд рдХрд░ рд░рд╣реЗ рд╣реИрдВ
@ steric85 , рдореБрдЭреЗ рдЯрд╛рдЗрдкрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдореЗрдВ window.require is not a function
рдХрд╛ рд╕рд╛рдордирд╛ рдХрд░рдирд╛ рдкрдбрд╝рд╛, рдореИрдВ рдЗрд╕реЗ рдЗрд╕ рддрд░рд╣ рдареАрдХ рдХрд░рдиреЗ рдореЗрдВ рдХрд╛рдордпрд╛рдм рд░рд╣рд╛:
declare global {
interface Window {
require: any;
}
}
const electron = window.require('electron');
рдореИрдВ рдЕрдкрдиреЗ рдХреЛрдгреАрдп рдРрдк рдореЗрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╕реЗ ipcRenderer рддрдХ рдкрд╣реБрдБрдЪрдиреЗ рдХреЗ рд▓рд┐рдП рдЙрдкрд░реЛрдХреНрдд рд╡рд┐рдзрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдЬрдм рдореИрдВ рдПрдХ ipcRenderer рд╕рдВрджреЗрд╢ рд╣реИрдВрдбрд▓рд░ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдПрдХ рдСрдмреНрдЬрд░реНрд╡реЗрдмрд▓ рдХреЛ рдЕрдкрдбреЗрдЯ рдХрд░рддрд╛ рд╣реВрдВ рддреЛ рдХреЛрдгреАрдп рдкрд░рд┐рд╡рд░реНрддрди рдХрд╛ рдкрддрд╛ рд▓рдЧрд╛рдирд╛ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред
рдХреНрдпрд╛ рдРрд╕рд╛ рдЗрд╕рд▓рд┐рдП рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдХреЛрдгреАрдп рдирд╣реАрдВ рдЬрд╛рдирддрд╛ рдХрд┐ ipcRenderer рдПрдХ EventEmitter рд╣реИ рдФрд░ рдЬрдм ipcRenderer рдИрд╡реЗрдВрдЯ рдЖрддреЗ рд╣реИрдВ рддреЛ рдЙрд╕реЗ рдкрд░рд┐рд╡рд░реНрддрди рдХрд╛ рдкрддрд╛ рд▓рдЧрд╛рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрддреА рд╣реИ?
рдХреЛрдгреАрдп 2 рдореЗрдВ рдореИрдВ рдЕрдкрдиреЗ рд░рд╛рдЬреНрдп рдХреЛ рддрд╛рдЬрд╝рд╛ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреЛрдгреАрдп рдХреЛ рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ рдмрддрд╛рдиреЗ рдХреЗ рд▓рд┐рдП applicationRef.tick()
рдкрд░ рдХреЙрд▓ рдХрд░рддрд╛ рдерд╛ред https://angular.io/api/core/ApplicationRef
рдореБрдЭреЗ @nukeop рдФрд░ @srinathh рдХреЗ рд╕рдорд╛рди рд╣реА рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рд╛рдордирд╛ рдХрд░рдирд╛ рдкрдбрд╝ рд░рд╣рд╛ рд╣реИ: рдореИрдВрдиреЗ рдЗрд╕ рдЖрд▓реЗрдЦ рдорд╛рд░реНрдЧрджрд░реНрд╢рд┐рдХрд╛ рдХреЗ рдмрд╛рдж рдЕрдкрдирд╛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди + рд░рд┐рдПрдХреНрдЯ + рд╡реЗрдмрдкреИрдХ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рд╕реНрдерд╛рдкрд┐рдд рдХрд┐рдпрд╛ рд╣реИ, рдЬрд╣рд╛рдВ рд▓реЗрдЦрдХ рдЕрдВрдд рдореЗрдВ window.require
рдХреЗ рд╕рд╛рде рдЪрд╛рд▓ рдХрд╛ рдЙрд▓реНрд▓реЗрдЦ рдХрд░рддрд╛ рд╣реИред рдореИрдВ рдЕрдкрдиреЗ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рдореЗрдВ рдХреЗрд╡рд▓ require('electron')
рджреЛ рд╕реНрдерд╛рди; рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рдкреНрд░рд╡реЗрд╢ рдмрд┐рдВрджреБ рдореЗрдВ, рдФрд░ рдПрдХ рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдирд┐рдпрдВрддреНрд░рдХ рд╡рд░реНрдЧ рдореЗрдВ рдЬреЛ рдХреБрдЫ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдШрдЯрдХреЛрдВ рдХреЗ рд▓рд┐рдП рдЖрд╡рд╢реНрдпрдХ рд╣реИред рдореЗрд░реА рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдкреНрд░рд╡рд┐рд╖реНрдЯрд┐ рдмрд┐рдВрджреБ рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рдореИрдВ рдмрд╕ const electron = require('electron');
рдХрд░рддрд╛ рд╣реВрдВ, рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдореБрдЦреНрдп рдкреНрд░рдХреНрд░рд┐рдпрд╛ рдореЗрдВ рдЪрд▓рдирд╛ рдЪрд╛рд╣рд┐рдП (рджрд╛рдПрдВ?), рдФрд░ рдореЗрд░реЗ рдирд┐рдпрдВрддреНрд░рдХ рд╡рд░реНрдЧ рдореЗрдВ рдореИрдВ const Electron = window.require('electron').remote;
рдЙрд╕рдХреЗ рдмрд╛рдж const Jsonfile = Electron.require('jsonfile');
рдХрд░рддрд╛ рд╣реВрдВред рд▓реЗрдХрд┐рди рдореБрдЭреЗ рдиреЛрдб_рдореЙрдбреНрдпреВрд▓реНрд╕/рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди/рдЗрдВрдбреЗрдХреНрд╕.рдЬреЗрдПрд╕ рдореЗрдВ рд▓рд╛рдЗрди рдЫрд╣ рдкрд░ @nukeop ("рдЯрд╛рдЗрдк рдПрд░рд░: fs.ExistsSync рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдирд╣реАрдВ рд╣реИ") рдЬреИрд╕реА рд╣реА рддреНрд░реБрдЯрд┐ рдорд┐рд▓рддреА рд╣реИ рдЬреЛ рдЗрд╕ рддрд░рд╣ рджрд┐рдЦрддреА рд╣реИ:
var fs = require('fs')
var path = require('path')
var pathFile = path.join(__dirname, 'path.txt')
if (fs.existsSync(pathFile)) {
module.exports = path.join(__dirname, fs.readFileSync(pathFile, 'utf-8'))
} else {
throw new Error('Electron failed to install correctly, please delete node_modules/electron and try installing again')
}
рдореИрдВрдиреЗ рдиреЛрдб_рдореЙрдбреНрдпреВрд▓/рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЛ рд╣рдЯрд╛рдиреЗ рдФрд░ рдлрд┐рд░ рд╕реЗ рд╕реНрдерд╛рдкрд┐рдд рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд┐рдпрд╛ рд╣реИред
рдореИрдВ macOS 10.12.6 рдкрд░ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди 1.7.5 рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рдФрд░ рдЖрд▓реЗрдЦ рдореЗрдВ рд╕реЗрдЯрдЕрдк рдХреЗ рд░реВрдк рдореЗрдВ npm run dev
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдЕрдкрдирд╛ рдкреНрд░реЛрдЬреЗрдХреНрдЯ рд╢реБрд░реВ рдХрд░рддрд╛ рд╣реВрдВред
рдЕрджреНрдпрддрди; рдореБрдЭреЗ require
рдорд┐рд▓рд╛ рдЬрд┐рд╕рд╕реЗ рдореЗрд░реА рддреНрд░реБрдЯрд┐ рд╣реБрдИ, рдореИрдВрдиреЗ рдЕрдкрдиреЗ рд░рд┐рдПрдХреНрдЯ index.js рдореЗрдВ require('electron-react-devtools')
рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХреАред рдЗрд╕реЗ const ReactDevtools = Electron.require('electron-react-devtools');
рдореЗрдВ рдмрджрд▓рдиреЗ рд╕реЗ рддреНрд░реБрдЯрд┐рдпрд╛рдВ рдмрдВрдж рд╣реЛ рдЧрдИрдВ, рд▓реЗрдХрд┐рди рдЕрдм рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдореИрдВ ReactDevtools рдЙрджрд╛рд╣рд░рдг рдореЗрдВ .inject()
рдХреЛ рдХреЙрд▓ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛ ("рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдирд╣реАрдВ рд╣реИ"), рд▓реЗрдХрд┐рди рдпрд╣ рдпрд╣рд╛рдВ рдЪрд░реНрдЪрд╛ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреБрдЫ рдирд╣реАрдВ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ .
@ steric85 рдРрд╕рд╛ рдЗрд╕рд▓рд┐рдП рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдЖрдк рд╡реЗрдмрдкреЗрдЬ рд╡рд╛рддрд╛рд╡рд░рдг рдореЗрдВ рдРрдк рдЪрд▓рд╛ рд░рд╣реЗ рд╣реИрдВ => рдЖрдкрдХреЛ рдРрдк рдХреЛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╡рд╛рддрд╛рд╡рд░рдг (Nodejs рд╡рд╛рддрд╛рд╡рд░рдг) рдореЗрдВ рдЪрд▓рд╛рдирд╛ рд╣реЛрдЧрд╛ред
рдореБрдЭреЗ рдЕрднреА рднреА window.require is not a function
рдорд┐рд▓ рд░рд╣рд╛ рд╣реИред рдореИрдВ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рд╕реНрдЯрд╛рд░реНрдЯрд░ рдХрд┐рдЯ (https://github.com/kriasoft/react-starter-kit) рдХреЗ рд╕рд╛рде рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдЗрд╕рдХреЗ рдЕрд▓рд╛рд╡рд╛ рд╕рдм рдХреБрдЫ рдареАрдХ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реИред
рдореИрдВрдиреЗ рд╡реЗрдм рд╕реЗ рдЕрдкрдирд╛ рдРрдк рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЕрдкрдирд╛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдРрдк рд╕реЗрдЯ рдХрд┐рдпрд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдРрдк рд╕реНрдерд╛рдиреАрдп рд░реВрдк рд╕реЗ рдирд╣реАрдВ рдЪрд▓ рд░рд╣рд╛ рд╣реИ:
https://gist.github.com/holgersindbaek/68f6db82f507967a51ca75c527faeff6
рдореИрдВ рдЬреЛ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рд╡рд╣ рдореЗрд░реА рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдлрд╛рдЗрд▓реЛрдВ рдореЗрдВ рд╕реЗ рдПрдХ рдореЗрдВ ipcRenderer
рдХреЛ рдХреЙрд▓ рдХрд░ рд░рд╣рд╛ рд╣реИред рдореБрдЭреЗ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдпрд╣ рддрдм рднреА рд╕рдВрднрд╡ рд╣реИ рдЬрдм рдореЗрд░рд╛ рдРрдк рд╡реЗрдм рд╕реЗ рд▓реЛрдб рдХрд┐рдпрд╛ рдЬрд╛ рд░рд╣рд╛ рд╣реЛред рдХреЛрдИ рд╕реБрдЭрд╛рд╡?
@holgersindbaek рдЖрдкрдХреЛ рдХреНрд░реЛрдо, рдлрд╛рдпрд░рдлреЙрдХреНрд╕ рдЖрджрд┐ рдЬреИрд╕реЗ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдореЗрдВ рдЕрдкрдирд╛ рдРрдк рдирд╣реАрдВ рджреЗрдЦрдирд╛ рдЪрд╛рд╣рд┐рдПред рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░реЗрдЧрд╛ рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рд╡реЗрдмрдкреЗрдЬ рд╡рд╛рддрд╛рд╡рд░рдг рд╣реИред
рдЖрдкрдХреЛ рдЕрдкрдирд╛ рдРрдк рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╡рд┐рдВрдбреЛ рдореЗрдВ рджреЗрдЦрдирд╛ рдЪрд╛рд╣рд┐рдПред
рдореИрдВ рд╣реВрдВ, рд▓реЗрдХрд┐рди рдореИрдВ рдПрдХ рддрд░рд╣ рд╕реЗ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рдЬрд╣рд╛рдВ рдореИрдВ рдкреНрд░рддреНрдпреЗрдХ рд▓реЙрдиреНрдЪ рдкрд░ рд╡реЗрдмрд╕рд╛рдЗрдЯ рд╕реЗ рдЕрдкрдирд╛ рдРрдк рд▓реЛрдб рдХрд░ рд░рд╣рд╛ рд╣реВрдВред рдЕрдирд┐рд╡рд╛рд░реНрдп рд░реВрдк рд╕реЗ рдореИрдВ рдЕрдкрдиреЗ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдРрдк рдореЗрдВ рдПрдХ рд╡реЗрдмрд╕рд╛рдЗрдЯ рджрд┐рдЦрд╛ рд░рд╣рд╛ рд╣реВрдВред рдЙрдкрд░реЛрдХреНрдд рдлрд╝рд╛рдЗрд▓ рджреЗрдЦреЗрдВред рдореИрдВ рд╕рд┐рд░реНрдл рдпрд╣ рд╕реБрдирд┐рд╢реНрдЪрд┐рдд рдХрд░рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВ рдХрд┐ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдореИрдВ рдХреБрдЫ рдирд╣реАрдВ рдХрд░ рд╕рдХрддрд╛ ?!
рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХрд┐рд╕реА рднреА рдпреВрдЖрд░рдПрд▓ рдХреЛ рд▓реЛрдб рдХрд░ рд╕рдХрддрд╛ рд╣реИред URL рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЖрдкрдХреЛ рдЗрд╕ рдлрд╝рдВрдХреНрд╢рди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдП mainWindow.loadURL(url)
=> рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╡рд┐рдВрдбреЛ рджреГрд╢реНрдп рдореЗрдВ, рд╡рд╣ URL рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХреЛрдб рдЖрд╡рд╢реНрдпрдХрддрд╛, рдЖрдИрдкреАрд╕реА, рдЖрджрд┐ рддрдХ рдкрд╣реБрдВрдЪ рд╕рдХрддрд╛ рд╣реИред
рдареАрдХред рдореИрдВ рд╡рд╣ рдХреЛрд╢рд┐рд╢ рдХрд░реВрдБрдЧрд╛ред
рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдкрд░ window.require
рдХрд╛рдо рдирд╣реАрдВ рдХрд┐рдпрд╛, рд▓реЗрдХрд┐рди window.require
рдХреЗ рд▓рд┐рдП fs
рдиреЗ рдХрд╛рдо рдХрд┐рдпрд╛ред
рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдпрдХреАрди рдирд╣реАрдВ рд╣реИ рдХрд┐ рдХреНрдпреЛрдВред рд▓реЗрдХрд┐рди рдпрд╣ рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реИ рдФрд░ рдЪреВрдВрдХрд┐ рдпрд╣ рдПрдХ рдЫреЛрдЯрд╛ рдирд┐рдЬреА рдкреНрд░реЛрдЬреЗрдХреНрдЯ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдореИрдВ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдЖрдЧреЗ рдирд╣реАрдВ рдмрдврд╝рд╛рдКрдВрдЧрд╛ред
рдзрдиреНрдпрд╡рд╛рдж @ nukeop
рдирдорд╕реНрддреЗ, рдпрд╣ рдореЗрд░рд╛ рдкреИрдХреЗрдЬ рд╣реИред рдЬреЗрд╕рди, рдореИрдВ рд╡реЗрдмрдкреИрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рдЗрдирдореЗрдВ рд╕реЗ рдХрд┐рд╕реА рдиреЗ рднреА рдореЗрд░реА рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдорд╛рдзрд╛рди рдирд╣реАрдВ рдХрд┐рдпрд╛, рдХреНрдпрд╛ рдХрд┐рд╕реА рдХреЗ рдкрд╛рд╕ рдХреЛрдИ рд╕рдорд╛рдзрд╛рди рд╣реИ? рдЬрдм рдореИрдВ window.require рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдореБрдЭреЗ рддреНрд░реБрдЯрд┐ рдорд┐рд▓реА "рд╡рд┐рдВрдбреЛ рдкрд░рд┐рднрд╛рд╖рд┐рдд рдирд╣реАрдВ рд╣реИ"
'рд╕рдЦреНрдд рдЙрдкрдпреЛрдЧ';
var рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди = рдЖрд╡рд╢реНрдпрдХрддрд╛ ('рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди')
рд╡рд░ рдРрдк = рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди.рдПрдк;
рд╡рд░ рдмреНрд░рд╛рдЙрдЬрд╝рд░рд╡рд┐рдВрдбреЛ = рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди.рдмреНрд░рд╛рдЙрдЬрд╝рд░рд╡рд┐рдВрдбреЛ;
рд╡рд░ рдореБрдЦреНрдпрд╡рд┐рдВрдбреЛ = рд╢реВрдиреНрдп;
app.on('рд░реЗрдбреА', рдлрдВрдХреНрд╢рди() {
рдореЗрдирд╡рд┐рдВрдбреЛ = рдирдпрд╛ рдмреНрд░рд╛рдЙрдЬрд╝рд░рд╡рд┐рдВрдбреЛ ({рдЪреМрдбрд╝рд╛рдИ: 800, рдКрдВрдЪрд╛рдИ: 600});
mainWindow.loadURL('file://' + __dirname + '/index.electron.html');
mainWindow.webContents.openDevTools();
});
рдореИрдВ рдЯрд╛рдЗрдкрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдФрд░ рдореБрдЭреЗ рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдерд╛
const electron = (<any>window).require("electron");
рдореЗрд░реЗ рд░реЗрдВрдбрд░рд░ рдХреЛ рдореЗрд░реЗ main. рдЖрд╢рд╛ рд╣реИ рдХрд┐ рдпрд╣ рдХрд┐рд╕реА рдХреА рдорджрдж рдХрд░рддрд╛ рд╣реИред
рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛ред
рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдпрджрд┐ рдЖрдкрдХреЛ рд░рд┐рдореЛрдЯ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ, рддреЛ
рдХреЙрдиреНрд╕ рд╡рд┐рдВрдбреЛ рдШреЛрд╖рд┐рдд рдХрд░реЗрдВ: рдХреЛрдИ рднреА;
рдХреЙрдиреНрд╕реНрдЯ {рд░рд┐рдореЛрдЯ} = window.require ('рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди');
рдирдорд╕реНрддреЗ, рдзрдиреНрдпрд╡рд╛рдж рдпрд╛рд░ред
рд╕реВрд░реНрдп рдХреЛ, 3 рджрд┐рд╕рдВрдмрд░, 2017 рдХреЛ рд░рд╛рдд 9:29 рдмрдЬреЗ, рдорд╛рдЗрдХрд▓ - <
рд╕реВрдЪрдирд╛рдПрдВ@github.com> рдиреЗ рд▓рд┐рдЦрд╛:
рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛ред
рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдпрджрд┐ рдЖрдкрдХреЛ рд░рд┐рдореЛрдЯ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ, рддреЛрдХреЙрдиреНрд╕ рд╡рд┐рдВрдбреЛ рдШреЛрд╖рд┐рдд рдХрд░реЗрдВ: рдХреЛрдИ рднреА;
рдХреЙрдиреНрд╕реНрдЯ {рд░рд┐рдореЛрдЯ} = window.require ('рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди');-
рдЖрдк рдЗрд╕реЗ рдкреНрд░рд╛рдкреНрдд рдХрд░ рд░рд╣реЗ рд╣реИрдВ рдХреНрдпреЛрдВрдХрд┐ рдЖрдкрдиреЗ рдЯрд┐рдкреНрдкрдгреА рдХреА рдереАред
рдЗрд╕ рдИрдореЗрд▓ рдХрд╛ рд╕реАрдзреЗ рдЙрддреНрддрд░ рджреЗрдВ, рдЗрд╕реЗ GitHub рдкрд░ рджреЗрдЦреЗрдВ
https://github.com/electron/electron/issues/7300#issuecomment-348801405 ,
рдпрд╛ рдереНрд░реЗрдб рдХреЛ рдореНрдпреВрдЯ рдХрд░реЗрдВ
https://github.com/notifications/unsubscribe-auth/ARDyd4c3aOkMbb058xklujMMbnmaoxKGks5s8uGVgaJpZM4KDU6t
.
@solominh рдпрд╣рд╛рдБ рдЖрдкрдХреЗ рд╕реНрдкрд╖реНрдЯреАрдХрд░рдг рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред рд╣рд╛рд▓рд╛рдБрдХрд┐ рдореЗрд░реЗ рдкрд╛рд╕ @holgersindbaek рдХреЗ рд╕рдорд╛рди рдХреЙрдиреНрдлрд╝рд┐рдЧрд░реЗрд╢рди рд╣реИ, рд╡реЗрдмрд╡реНрдпреВ рдореЗрдВ рдХреМрди рд╕рд╛ рд╡рд╛рддрд╛рд╡рд░рдг рдкреНрд░реАрд▓реЛрдб рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд╣реИ?
рдЬрд╛рдирдХрд╛рд░реА:
mainWindow.loadURL(url)
рдЪрд▓рддреА рд╣реИ, рдЬрд╣рд╛рдВ url рдПрдХ рд╕реНрдерд╛рдиреАрдп index.html . рд╣реИ<webview>
рд╣реИpreload
рдлрд╝реАрд▓реНрдб рд╣реИ рдЬреЛ inject.js рдХреЛ рд▓реЛрдб рдХрд░рддрд╛ рд╣реИ, рдФрд░ рдпрд╣ рд╕реНрдХреНрд░рд┐рдкреНрдЯ window.require('electron') рдХрд░рддреА рд╣реИредрдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдВ:
const electron = require('electron')
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдореБрдЭреЗ рддреНрд░реБрдЯрд┐ рд╣реИ fs.readFileSync is not a function
const electron = window.require('electron')
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ, рддреЛ рдореБрдЭреЗ рддреНрд░реБрдЯрд┐ рд╣реИ window.require is not a function
редрд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ: рдореЗрд░реЗ рд▓рд┐рдП <webview nodeintegration="true">
рдФрд░ window.require рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рд╣рд▓ рдХрд┐рдпрд╛ рдЧрдпрд╛ред рднрд╡рд┐рд╖реНрдп рдХреЗ рд╕рдВрджрд░реНрдн рдХреЗ рд▓рд┐рдП рдпрд╣рд╛рдВ рдиреЛрдЯ рдЫреЛрдбрд╝ рд░рд╣реЗ рд╣реИрдВред
window.require рдиреЗ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛! рдзрдиреНрдпрд╡рд╛рдж рджреЛрд╕реНрддреЛрдВ!
рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдореЗрдВ рддреНрд░реБрдЯрд┐ рд╕рдВрджреЗрд╢ рдЬрдм рдореИрдВрдиреЗ рдпрд╣ рдХреЛрд╢рд┐рд╢ рдХреА
nodeIntegration: false
рдХреЛ рд╡рд╛рдкрд╕ рдХрд░рдирд╛ рднреВрд▓ рдЧрдП рдЬреЛ window.require()..
рдХреЛ рднреА рдирд┐рд╖реНрдХреНрд░рд┐рдп рдХрд░ рджреЗрддрд╛ рд╣реИред рдмреЗрд╡рдХреВрдлреАрд╝ рднрд░реА рдЧрд▓реНрддреАред рдЖрд╢рд╛ рд╣реИ рдХрд┐ рдпрд╣ рдХрд┐рд╕реА рдХреЛ рд╢реЛрдз рдХреЗ рдПрдХ рдШрдВрдЯреЗ рддрдХ рдмрдЦреНрд╢ рджреЗрдЧрд╛ред
@ phil294 рдзрдиреНрдпрд╡рд╛рдж рдпрд╛рд░! рдЖрдкрдиреЗ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рд╢реЛрдз рдХреЗ рдПрдХ рдШрдВрдЯреЗ рдХреА рдмрдЪрдд рдХреАред
рд╣рд╛рдп @micsel ,
рдореИрдВрдиреЗ рдХреЙрдиреНрд╕реНрдЯреЗрдмрд▓ рд╡рд┐рдВрдбреЛ рдШреЛрд╖рд┐рдд рдХрд┐рдпрд╛: рдХреЛрдИ рднреА;
рд▓реЗрдХрд┐рди рдпрд╣ рд╕рд┐рдВрдЯреЗрдХреНрд╕ рддреНрд░реБрдЯрд┐ рдлреЗрдВрдХ рд░рд╣рд╛ рд╣реИред
рдХреЛрдИ рд╡рд┐рдЪрд╛рд░ рдХреНрдпреЛрдВ?
рд╣рд╛рдВ, рдХреЙрдиреНрд╕реНрдЯреЗрдмрд▓ рд╡рд┐рдВрдбреЛ рдШреЛрд╖рд┐рдд рдХрд░реЗрдВ: рдХреЛрдИ рднреА; рд╢реАрд░реНрд╖ рдкрд░, рдЖрдпрд╛рдд рдХреЗ рдареАрдХ рдмрд╛рджред
рдпрджрд┐ рдЖрдкрдХреЛ window.require рдХреЛрдИ рдлрд╝рдВрдХреНрд╢рди рдирд╣реАрдВ рдорд┐рд▓рддрд╛ рд╣реИ рдФрд░ рдЖрдк Angular-CLI рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рддреЛ рд╡рд┐рдВрдбреЛ рдЗрдВрдЯрд░рдлрд╝реЗрд╕ рдХреЛ рдЗрдВрд╕реНрдЯреЗрдВрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдирд┐рдореНрди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ:
./src/typings.d.ts
declare var window: Window;
interface Window {
require: any;
}
рддрдм рдЖрдк рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЛ рд╢рд╛рдорд┐рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ:
const { ipcRenderer } = window.require('electron');
рдпрджрд┐ рдЖрдк рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдРрдк рдореЗрдВ рдХреЛрдгреАрдп 2+ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реЗ рд╣реИрдВ рддреЛ "рдПрдирдЬреАрдПрдХреНрд╕-рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди" рд▓рд┐рдм рдЖрдпрд╛рдд рдХрд░реЗрдВ рдФрд░ рдЗрд╕реЗ any.componets.ts рдореЗрдВ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ
import { ElectronService } from 'ngx-electron';
//constructor
constructor(
private elt: ElectronService
){
var fs = this.elt.remote.require('fs');
}
рдореИрдВ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рд╕рд╛рде рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдЬреЗрдПрд╕ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдФрд░ рдЬрдм рдореИрдВ рдЗрд╕ рд▓рд╛рдЗрди рдХреЛ рдЯрд░реНрдорд┐рдирд▓ рдпрд╛рд░реНрди рд░рди рд╕реНрдЯрд╛рд░реНрдЯ рдореЗрдВ рдЪрд▓рд╛рддрд╛ рд╣реВрдВ рддреЛ рдпрд╣ рдореБрдЭреЗ рддреНрд░реБрдЯрд┐ рдкреНрд░рджрд╛рди рдХрд░рддрд╛ рд╣реИ рдЕрдирдХреЙрдЯреЗрдб рдЯрд╛рдЗрдк рдПрд░рд░: window.require рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдирд╣реАрдВ рд╣реИ рдореИрдВ рдЯрд╛рдЗрдкрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдХрд┐ рд░рд┐рдПрдХреНрдЯ рдЬреЗрдПрд╕ рдореЗрдВ рд╡рд┐рдВрдбреЛ рдХреИрд╕реЗ рдШреЛрд╖рд┐рдд рдХрд░реЗрдВ
рдЬреЛ рд▓реЛрдЧ рдЕрднреА рднреА рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рд╛рдордирд╛ рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рдХрд┐рд╕реА рддрд░рд╣ window.require()
рдХрд░рдиреЗ рд╕реЗ рдХреЛрдбрдмреЗрд╕ рдореЗрдВ import
рд╕реНрдЯреЗрдЯрдореЗрдВрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреА рд╕реНрдерд┐рд░рддрд╛ рдЦрд░рд╛рдм рд╣реЛ рдЬрд╛рддреА рд╣реИред рдПрдХ рдЖрд╕рд╛рди рд╡рд┐рдХрд▓реНрдк рд╣реИ рдЕрдкрдиреЗ рд╡реЗрдмрдкреИрдХ рдХреЛ target
рд╕реЗ electron-renderer
рдкрд░ рд╕реЗрдЯ рдХрд░рдирд╛ред рдпрджрд┐ рд░рд┐рдПрдХреНрдЯ рдРрдк рдмрдирд╛рдПрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рддреЛ рдмрд╛рд╣рд░ рдирд┐рдХрд╛рд▓рдирд╛ рдПрдХ рдЧрдбрд╝рдмрдбрд╝ рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдЗрд╕рд▓рд┐рдП, рдЖрдк рдЗрд╕ рдкреИрдХреЗрдЬ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдЬреЛ рдЖрдкрдХреЗ рд▓рд┐рдП рд╡реЗрдмрдкреИрдХ рд╣реБрдХрд┐рдВрдЧ рдХрд░рддрд╛ рд╣реИ рдФрд░ рдЖрдк рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВред import fs from 'fs'
рдЕрдкрдиреЗ рд░рд┐рдПрдХреНрдЯ рдШрдЯрдХреЛрдВ (рдпрд╛ рдХрд┐рд╕реА рдЕрдиреНрдп рдиреЛрдб рдореЙрдбреНрдпреВрд▓) рдореЗрдВ, рдЕрдкрдиреЗ рдЬреАрд╡рди рдореЗрдВ рдЦреБрд╢реА рд╕реЗ :)
Vue CLI 3 рд╡рд╛рд▓реА рд╡рд┐рдВрдбреЛ рдкрд░, window.require рдХрд╛рдо рдХрд░реЗрдЧрд╛ рд▓реЗрдХрд┐рди рдЗрд╕рдХреЗ рд▓рд┐рдП "рдиреЛрдб_рдореЙрдбреНрдпреВрд▓реНрд╕/" рд╕реЗ рд╕рдВрдмрдВрдзрд┐рдд рдкрде рдХреЗ рдмрдЬрд╛рдп рдПрдХ рдкреВрд░реНрдг рдкрде рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реЛрдЧреАред
рд▓реЗрдХрд┐рди рд░рд┐рдПрдХреНрдЯ рдорд╛рдорд▓реЗ рдХреЗ рд╕рдорд╛рди, vue.config.js рдХреЛ рд╕рдВрдкрд╛рджрд┐рдд рдХрд░рдХреЗ рд╡реЗрдмрдкреИрдХ рдХреЛ Vue рдХреЗ рд▓рд┐рдП рдареАрдХ рд╕реЗ рдХреЙрдиреНрдлрд╝рд┐рдЧрд░ рдХрд┐рдпрд╛ рдЬрд╛ рд╕рдХрддрд╛ рд╣реИред "рдЖрд╡рд╢реНрдпрдХрддрд╛" рддрдм рдЕрдкреЗрдХреНрд╖рд╛ рдХреЗ рдЕрдиреБрд░реВрдк рдХрд╛рдо рдХрд░реЗрдЧреАред
vue.config.js:
module.exports = {
configureWebpack: config => {
if (process.env.NODE_ENV === 'production') {
config.output.publicPath = `${process.cwd()}/dist/`
}
config.target = 'electron-renderer'
}
}
рд░рд╛рдЙрдЯрд░.рдЬреЗрдПрд╕ (рдпрд╣ рд╕рд┐рд░реНрдл рдПрдХ рдЙрджрд╛рд╣рд░рдг рд╣реИ, рдпрд╣ рдХрд┐рд╕реА рдЕрдиреНрдп рд╡реАрдпреВ рдЬреЗрдПрд╕ рдлрд╛рдЗрд▓ рдореЗрдВ рдХрд╛рдо рдХрд░реЗрдЧрд╛)
const Store = require("electron-store");
const store = new Store();
_рдореИрдВ рд▓рдЧрднрдЧ рдЗрд╕реЗ рдЬреЛрдбрд╝рдирд╛ рдирд╣реАрдВ рдЪрд╛рд╣рддрд╛, рд▓реЗрдХрд┐рди рдЗрд╕рд╕реЗ рдореБрдЭреЗ рдбрд┐рдмрдЧрд┐рдВрдЧ рдореЗрдВ рдПрдХ рдпрд╛ рджреЛ рдШрдВрдЯреЗ рдХреА рдмрдЪрдд рд╣реЛрддреАред_
рдореБрдЭреЗ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП rm -rf node_modules && npm install
рдХрд░рдирд╛ рдкрдбрд╝рд╛ред рдореИрдВ рддрдм window
рдХреЛ window.require
рд╕реЗ рд╣рдЯрд╛рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рдерд╛ рдФрд░ рдЪреАрдЬреЗрдВ рдлрд┐рд░ рд╕реЗ рдХрд╛рдо рдХрд░рдиреЗ рд▓рдЧреАрдВред рдЙрдореНрдореАрдж рд╣реИ рдХрд┐ рдпрд╣ рдХрд┐рд╕реА рдФрд░ рдХреА рдорджрдж рдХрд░рддрд╛ рд╣реИред
@cperthuis рдореИрдВ рд╕рд┐рд░реНрдл рдзрдиреНрдпрд╡рд╛рдж рдХрд╣рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдБ !! рд╣рд╛рд╣рд╛, рдореИрдВ Vue рдХрд╛ рднреА рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рд▓реЗрдХрд┐рди рддрд╛рд░реНрдХрд┐рдХ рд╕реЛрдЪ рдиреЗ рдореБрдЭреЗ рдпрд╣ рдкрддрд╛ рд▓рдЧрд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдкреНрд░реЗрд░рд┐рдд рдХрд┐рдпрд╛ рдХрд┐ рдореИрдВ рд▓рдХреНрд╖реНрдп рд╕рдВрдкрддреНрддрд┐ рд░рдЦрдиреЗ рдХреЗ рд▓рд┐рдП рдЕрдкрдирд╛ webpack.config.js рдмрджрд▓ рд╕рдХрддрд╛ рд╣реВрдВ :)
рдПрдХ рдЬрд╛рджреВ рдХреА рддрд░рд╣ рдХрд╛рдо рдХрд┐рдпрд╛ред
рдирдорд╕реНрддреЗ,
window.require
рдПрдХ рджреЗрд╡ рд╕реНрдерд╛рдиреАрдп рд╕рд░реНрд╡рд░ рд╡рд╛рддрд╛рд╡рд░рдг рдореЗрдВ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдПрдХ рдЫреЛрдЯреЗ рд╕реЗ HTML рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рд░рд┐рдПрдХреНрдЯ рдРрдк рдмрдирд╛рдиреЗ рдХреЗ рдмрд╛рдж рдПрдХ рдареЗрд╕ рд╡рд╛рддрд╛рд╡рд░рдг рдореЗрдВ рдирд╣реАрдВ рд╣реИред
function createWindow() {
win = new BrowserWindow({
width: 1280,
height: 720,
icon: path.join(__dirname, 'assets/icons/png/64x64.png'),
webPreferences: {
nodeIntegration: true,
preload: __dirname + '/preload.js'
}
})
win.setPosition(0, 0)
win.loadURL(isDev ? 'http://localhost:3000' : `file://${path.join(__dirname, 'build/index.html')}`)
}
рдпрд╣ localhost:3000
рдХреЗ рд╕рд╛рде рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рд▓реЗрдХрд┐рди file://${path.join(__dirname, 'build/index.html')}
рдХреЗ рд╕рд╛рде рдирд╣реАрдВ
@cperthuis , рдЖрдкрдХреЗ рдлрд┐рдХреНрд╕ рдиреЗ 'рд░рд┐рдПрдХреНрд╢рди-рдРрдк-рд░рд┐рд╡рд╛рдпрд░реНрдб' рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдЕрди-рдЗрдЬреЗрдХреНрдЯреЗрдб рд╕реАрдЖрд░рдП рдРрдк рдХреЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛ред рд╢реБрдХреНрд░рд┐рдпрд╛ред
Create-React-App 2 рдХреЗ рд╕рд╛рде, рдЖрдк craco
npm рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ:
https://www.npmjs.com/package/@craco/craco
рдЕрдкрдиреЗ рдкреИрдХреЗрдЬ рдореЗрдВ react-scripts
рдХреЛ craco
рд╕реЗ рдмрджрд▓реЗрдВредjson
craco.config.js
module.exports = {
webpack: {
configure: {
target: 'electron-renderer'
}
}
};
рдФрд░ рдЗрд╕рдореЗрдВ рдЖрдкрдХреЗ рдкрд╛рд╕ рдЕрдкрдиреЗ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╕рдВрджрд░реНрдн рддрдХ рдкрд╣реБрдВрдЪ рд╣реЛрдЧреА:
import Electron from 'electron';
const { dialog } = Electron.remote;
@ Maxou44 рдХреНрд░реЗрдХреЛ рдФрд░ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдЯрд┐рдк рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред рдпрд╣ рд╡рд╣реА рд╣реИ рдЬреЛ рдореБрдЭреЗ рдЪрд╛рд╣рд┐рдП рдерд╛ред рдЕрдЧрд░ рдХреЛрдИ рдЙрджрд╛рд╣рд░рдг рдХреА рддрд▓рд╛рд╢ рдореЗрдВ рд╣реИ ...
@wwlib рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рдирд╣реАрдВ, рдпрд╣ рджреЗрдЦрдХрд░ рдЦреБрд╢реА рд╣реБрдИ рдХрд┐ рдЗрд╕рд╕реЗ рдЖрдкрдХреЛ рдорджрдж рдорд┐рд▓реА
nodeIntegration: false
рдХреЛ рд╡рд╛рдкрд╕ рдХрд░рдирд╛ рднреВрд▓ рдЧрдП рдЬреЛwindow.require()..
рдХреЛ рднреА рдирд┐рд╖реНрдХреНрд░рд┐рдп рдХрд░ рджреЗрддрд╛ рд╣реИред рдмреЗрд╡рдХреВрдлреАрд╝ рднрд░реА рдЧрд▓реНрддреАред рдЖрд╢рд╛ рд╣реИ рдХрд┐ рдпрд╣ рдХрд┐рд╕реА рдХреЛ рд╢реЛрдз рдХреЗ рдПрдХ рдШрдВрдЯреЗ рддрдХ рдмрдЦреНрд╢ рджреЗрдЧрд╛ред
рдмрд╣реБрдд - рдмрд╣реБрдд рдзрдиреНрдпрд╡рд╛рджред
рдХреГрдкрдпрд╛ рдзреНрдпрд╛рди рджреЗрдВ рдХрд┐ рдпрджрд┐ рдЖрдк рджреВрд░рд╕реНрде рд╕рд╛рдордЧреНрд░реА рд▓реЛрдб рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рддреЛ nodeIntegration
рдХреЛ рдЧрд▓рдд рдкрд░ рд╕реЗрдЯ рдХрд░рдирд╛ рдорд╣рддреНрд╡рдкреВрд░реНрдг рд╣реИ: https://electronjs.org/docs/tutorial/security#2 -disable-nodejs-integration-for-remote -рд╡рд┐рд╖рдп
рдирдорд╕реНрддреЗ,
рдореБрдЭреЗ рд╡рд╣реА рддреНрд░реБрдЯрд┐ рд╣реЛ рд░рд╣реА рд╣реИред window.require рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп, Uncaught TypeError: fs.readFileSync is not a function
рддреНрд░реБрдЯрд┐ рдареАрдХ рд╣реЛ рдЧрдИ рд╣реИ рд▓реЗрдХрд┐рди рдореИрдВ рдПрдХ рдФрд░ рддреНрд░реБрдЯрд┐ Uncaught TypeError: window.require is not a function
рд▓реЗрдХрд░ рдЖрдпрд╛ рд╣реВрдВред
рдХреНрдпрд╛ рдЗрд╕реЗ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреЛрдИ рд╕реБрдЭрд╛рд╡ рд╣реИред рдореИрдВ рдиреЛрдб рдЬреЗрдПрд╕ рдкрд░ рдмреНрд░рд╛рдЙрдЬрд╝рд░рд┐рдлрд╝ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВред
рдХрд┐рд╕реА рдХреЗ рд▓рд┐рдП рдЕрднреА рднреА рдЗрд╕ рдкрд░ рдЕрдЯрдХрд╛ рд╣реБрдЖ рд╣реИ: рдЖрдкрдХреЛ рддреНрд░реБрдЯрд┐ window.require is not a function
рдорд┐рд▓реЗрдЧреА рдЬрдм рддрдХ рдХрд┐ рдЖрдк рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ nodeIntergation
рдХреЛ true
рдХреЗ рд░реВрдк рдореЗрдВ рдШреЛрд╖рд┐рдд рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ рдЬрдм рдЖрдк рдЕрдкрдирд╛ BrowserWindow
рдШреЛрд╖рд┐рдд рдХрд░рддреЗ рд╣реИрдВ:
new BrowserWindow({
webPreferences: {
nodeIntegration: true,
}
});
рдореБрдЭреЗ рдорд┐рд▓рд╛ рдПрдХрдорд╛рддреНрд░ рдЕрдЪреНрдЫрд╛ рдкрд░реНрдпрд╛рдкреНрдд рд╕рдорд╛рдзрд╛рди рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╣реИ:
react-app-rewired
рдкреИрдХреЗрдЬeject
рдХреЗ рдмрд┐рдирд╛ рдХрд╕реНрдЯрдо рд╡реЗрдмрдкреИрдХ рдХреЙрдиреНрдлрд┐рдЧрд░реЗрд╢рди рдХреЛ рдЗрдВрдЬреЗрдХреНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрд╕ рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ: "scripts": {
...
"start": "react-app-rewired start",
},
config-overrides.js
рдЬреЛрдбрд╝реЗрдВ:module.exports = function override (config, env) {
config.target = 'electron-renderer'
return config;
}
рдЗрд╕рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж: @ рд▓реАрд▓рдВрдЧрд╛ рдЯрд┐рдкреНрдкрдгреА , @agrublev рдЯрд┐рдкреНрдкрдгреА рдФрд░ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдРрдк- рд░реАрд╡рд╛рдпрд░реНрдб рдХреЗ рдирд┐рд░реНрдорд╛рддрд╛ред
рдЕрдкрдбреЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛:
рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдРрд╕рд╛ рдХрд░рдиреЗ рдХрд╛ рджреВрд╕рд░рд╛ рд╕рдВрд╕реНрдХрд░рдг: https://www.codementor.io/randyfindley/how-to-build-an-electron-app-use-create-react-app-and-electron-builder-ss1k0sfer
рдЕрдкрдбреЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛2:
@nukeop рдореИрдВрдиреЗ Browserify рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреНрдпреЛрдВ рди рдХрд░реЗрдВ рдпрд╛ рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреНрдпреЛрдВ рди рдХрд░реЗрдВ, рдЗрд╕ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╣рд╕ рдХрд╛ рдкрд╛рд▓рди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╕рдордп рдХреА рдХрдореА рдХреЗ рдХрд╛рд░рдг рдХреБрдЫ рднреНрд░рд╛рдордХ рдмрдпрд╛рдиреЛрдВ рдХреЛ рд╣рдЯрд╛ рджрд┐рдпрд╛ рдФрд░ рдЕрдм рд╡рд┐рд╕реНрддреГрдд рд╡рд┐рд╡рд░рдг рдирд╣реАрдВ рд▓рд┐рдЦ рд╕рдХрддрд╛ рдХрд┐ рдореЗрд░рд╛ рдХреНрдпрд╛ рдорддрд▓рдм рд╣реИред рд▓реЗрдХрд┐рди рдореИрдВ рдЗрд╕ рдмрд╛рд░реЗ рдореЗрдВ рд╡реНрдпрдХреНрддрд┐рдЧрдд рд░рд╛рдп рд░рдЦреВрдВрдЧрд╛ рдХрд┐ "рдмрд╕ window.require
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдорд╛рдзрд╛рди рд╣реЛрдЧрд╛" рдмрд╣реБрдд рдЕрд╡рд┐рд╢реНрд╡рд╕рдиреАрдп рд▓рдЧрддрд╛ рд╣реИред
рдЧрд▓рдд рдХреИрд╕реЗ?
рдпрд╣ рдПрдХ рд░рд┐рдПрдХреНрдЯ рдРрдк рд╣реИ рдЬреЛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╡рд╛рддрд╛рд╡рд░рдг рдХреЗ рдЕрдВрджрд░ рдЪрд▓рдирд╛ рдЪрд╛рд╣рд┐рдП рди рдХрд┐ рдЗрд╕рдХреЗ рд╡рд┐рдкрд░реАрдд
рдХреНрдпрд╛?
_рдореИрдВ рд▓рдЧрднрдЧ рдЗрд╕реЗ рдЬреЛрдбрд╝рдирд╛ рдирд╣реАрдВ рдЪрд╛рд╣рддрд╛, рд▓реЗрдХрд┐рди рдЗрд╕рд╕реЗ рдореБрдЭреЗ рдбрд┐рдмрдЧрд┐рдВрдЧ рдореЗрдВ рдПрдХ рдпрд╛ рджреЛ рдШрдВрдЯреЗ рдХреА рдмрдЪрдд рд╣реЛрддреАред_
рдореБрдЭреЗ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХреЛ рдареАрдХ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП
rm -rf node_modules && npm install
рдХрд░рдирд╛ рдкрдбрд╝рд╛ред рдореИрдВ рддрдмwindow
рдХреЛwindow.require
рд╕реЗ рд╣рдЯрд╛рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рдерд╛ рдФрд░ рдЪреАрдЬреЗрдВ рдлрд┐рд░ рд╕реЗ рдХрд╛рдо рдХрд░рдиреЗ рд▓рдЧреАрдВред рдЙрдореНрдореАрдж рд╣реИ рдХрд┐ рдпрд╣ рдХрд┐рд╕реА рдФрд░ рдХреА рдорджрдж рдХрд░рддрд╛ рд╣реИред
рд╡рд╛рд╣.. рдЗрд╕ рдереНрд░реЗрдб рдореЗрдВ рд╕рдм рдХреБрдЫ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХреА рдФрд░ рдЖрдкрдХреЗ рд░реАрдкреНрд▓реЗ рдХреЛ рдпрд╛рдж рдХрд┐рдпрд╛ рдХреНрдпреЛрдВрдХрд┐ рдХреЛрдИ рдЕрдкрд╡реЛрдЯ рдирд╣реАрдВ рдерд╛.. рдЕрднреА рднреА window is not a function
рдорд┐рд▓рд╛ ..
node_modules
рдФрд░ рдЗрд╕рдХреЗ рдХрд╛рдордХрд╛рдЬ рдХреЛ рд╣рдЯрд╛рдпрд╛ рдФрд░ рдкреБрдирд░реНрд╕реНрдерд╛рдкрд┐рдд рдХрд┐рдпрд╛ред
рдкреБрдирд╢реНрдЪ: рдЖрдкрдХреЛ рдЕрднреА рднреА рд╕рднреА рд╕рдорд╛рдзрд╛рди рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ, рд▓реЗрдХрд┐рди рдпрджрд┐ рдЖрдкрдиреЗ рд╕рдм рдХреБрдЫ рдХрд┐рдпрд╛ рд╣реИ
рдФрд░ рдлрд┐рд░ рднреА рд╡рд╣реА node_modules
. рдлрд┐рд░ рд╕реЗ рд╕реНрдерд╛рдкрд┐рдд рдХрд░реЗрдВ
рдЖрдкрдиреЗ рдореЗрд░рд╛ рджрд┐рди рдмрдЪрд╛рдпрд╛ @joshuapinter !
рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдирд┐рд░реНрдорд╛рдг-рдРрдк рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдореБрдЭреЗ рд╡рд╣реА рддреНрд░реБрдЯрд┐рдпрд╛рдВ рдорд┐рд▓реАрдВред
рд╕рдорд╛рдзрд╛рди рдЕрдм рддрдХ рдерд╛:
const electron = window.require("electron")
рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рднрд╛рдЧ рдореЗрдВ BrowserWindow
рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рддрд░реАрдХреЗ рд╕реЗ nodeIntegration:true
$ рдЬреЛрдбрд╝реЗрдВред
mainWindow = new BrowserWindow({ width: 900, height: 680, webPreferences: { webSecurity: false, nodeIntegration: true } });
рдореБрдЭреЗ рдорд┐рд▓рд╛ рдПрдХрдорд╛рддреНрд░ рдЕрдЪреНрдЫрд╛ рдкрд░реНрдпрд╛рдкреНрдд рд╕рдорд╛рдзрд╛рди рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╣реИ:
- рджреЗрд╡ рдирд┐рд░реНрднрд░рддрд╛ рдХреЗ рд░реВрдк рдореЗрдВ рд╕реНрдерд╛рдкрд┐рдд рдХрд░реЗрдВ
react-app-rewired
рдкреИрдХреЗрдЬ- рд╕реАрдЖрд░рдП рдореЗрдВ
eject
рдХреЗ рдмрд┐рдирд╛ рдХрд╕реНрдЯрдо рд╡реЗрдмрдкреИрдХ рдХреЙрдиреНрдлрд┐рдЧрд░реЗрд╢рди рдХреЛ рдЗрдВрдЬреЗрдХреНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЗрд╕ рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ:"scripts": { ... "start": "react-app-rewired start", },
- рдФрд░ рд╕рд╛рдордЧреНрд░реА рдХреЗ рдЕрдиреБрд╕рд╛рд░ рдлрд╝рд╛рдЗрд▓
config-overrides.js
рдЬреЛрдбрд╝реЗрдВ:module.exports = function override (config, env) { config.target = 'electron-renderer' return config; }
рдЗрд╕рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж: @ рд▓реАрд▓рдВрдЧрд╛ рдЯрд┐рдкреНрдкрдгреА , @agrublev рдЯрд┐рдкреНрдкрдгреА рдФрд░ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдРрдк- рд░реАрд╡рд╛рдпрд░реНрдб рдХреЗ рдирд┐рд░реНрдорд╛рддрд╛ред
рдЕрдкрдбреЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛:
рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдРрд╕рд╛ рдХрд░рдиреЗ рдХрд╛ рджреВрд╕рд░рд╛ рд╕рдВрд╕реНрдХрд░рдг: https://www.codementor.io/randyfindley/how-to-build-an-electron-app-use-create-react-app-and-electron-builder-ss1k0sferрдЕрдкрдбреЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛2:
@nukeop рдореИрдВрдиреЗ Browserify рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреНрдпреЛрдВ рди рдХрд░реЗрдВ рдпрд╛ рдЗрд╕рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреНрдпреЛрдВ рди рдХрд░реЗрдВ, рдЗрд╕ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╣рд╕ рдХрд╛ рдкрд╛рд▓рди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╕рдордп рдХреА рдХрдореА рдХреЗ рдХрд╛рд░рдг рдХреБрдЫ рднреНрд░рд╛рдордХ рдмрдпрд╛рдиреЛрдВ рдХреЛ рд╣рдЯрд╛ рджрд┐рдпрд╛ рдФрд░ рдЕрдм рд╡рд┐рд╕реНрддреГрдд рд╡рд┐рд╡рд░рдг рдирд╣реАрдВ рд▓рд┐рдЦ рд╕рдХрддрд╛ рдХрд┐ рдореЗрд░рд╛ рдХреНрдпрд╛ рдорддрд▓рдм рд╣реИред рд▓реЗрдХрд┐рди рдореИрдВ рдЗрд╕ рдмрд╛рд░реЗ рдореЗрдВ рд╡реНрдпрдХреНрддрд┐рдЧрдд рд░рд╛рдп рд░рдЦреВрдВрдЧрд╛ рдХрд┐ "рдмрд╕window.require
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рдорд╛рдзрд╛рди рд╣реЛрдЧрд╛" рдмрд╣реБрдд рдЕрд╡рд┐рд╢реНрд╡рд╕рдиреАрдп рд▓рдЧрддрд╛ рд╣реИред
рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛ред рдЖрдкрдХреЛ рдзрдиреНрдпрд╡рд╛рдж
window.require
рдХреЗ рд╕рд╛рде рд╕рдорд╕реНрдпрд╛ рдпрд╣ рд╣реИ рдХрд┐ рдпрд╣ рдХреЗрд╡рд▓ рд╢реАрд░реНрд╖ рд╕реНрддрд░ рдХреЗ рдкреИрдХреЗрдЬ рдХреЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред
рдЙрджрд╛рд╣рд░рдг рдХреЗ рд▓рд┐рдП рдЕрдЧрд░ рдореИрдВ рд╕реАрдзреЗ fs
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ, рддреЛ рдпрд╣ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред рд▓реЗрдХрд┐рди рдЕрдЧрд░ рдореИрдВ рдРрд╕реЗ рдкреИрдХреЗрдЬ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдВ рдЬрд┐рд╕рдХреА fs
рдкрд░ рдирд┐рд░реНрднрд░рддрд╛ рд╣реИ рддреЛ рдореБрдЭреЗ рдЕрднреА рднреА рдЕрдкрд╡рд╛рдж рдорд┐рд▓рддрд╛ рд╣реИред
window.require
рдЬрдм рдореИрдВ рд░рд┐рдПрдХреНрдЯ рдРрдк рдХреЗ рдЕрдВрджрд░ рдлрд╝рдВрдХреНрд╢рди рдХреЛ рдХреЙрд▓ рдХрд░рддрд╛ рд╣реВрдВ рддреЛ рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред рдореБрдЭреЗ "TypeError: window.require рдПрдХ рдлрдВрдХреНрд╢рди рдирд╣реАрдВ рд╣реИ" рдорд┐рд▓рд╛ред
App.js
:
```рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ
'рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛' рд╕реЗ рдЖрдпрд╛рдд рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛, {useEffect, useState};
рдЖрдпрд╛рдд './App.css';
const ipcRenderer = window.require('electron').ipcRenderer;
рдлрд╝рдВрдХреНрд╢рди рдРрдк () {
useEffect( () => {
ipcRenderer.on('ping', (event, message) => { console.log(message) });
}, []);
return (
<div className = 'App'>
<div className = 'Header-Arrow'></div>
<div className = 'Box'>
<p>Press тМШ + тЗз + 4</p>
</div>
</div>
);
}
рдирд┐рд░реНрдпрд╛рдд рдбрд┐рдлрд╝реЙрд▓реНрдЯ рдРрдк;
````
Main.js
рдкрд░ рдореЗрдирд╡рд┐рдВрдбреЛ рдЪрд░:
```рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ
// рдмреНрд░рд╛рдЙрдЬрд╝рд░ рд╡рд┐рдВрдбреЛ рдмрдирд╛рдПрдВред
рдореЗрдирд╡рд┐рдВрдбреЛ = рдирдпрд╛ рдмреНрд░рд╛рдЙрдЬрд╝рд░рд╡рд┐рдВрдбреЛ ({
рд╣рдореЗрд╢рд╛рдСрдирдЯреЙрдк: рд╕рдЪ,
рдлреНрд░реЗрдо: рдЭреВрдард╛,
рдкреВрд░реНрдг рд╕реНрдХреНрд░реАрди рдпреЛрдЧреНрдп: рдЭреВрдард╛,
рдкрд╛рд░рджрд░реНрд╢реА: рд╕рдЪ,
рд╢реАрд░реНрд╖рдХрдмрд╛рд░ рд╕реНрдЯрд╛рдЗрд▓: 'рдХрд╕реНрдЯрдордмрдЯрди рдСрдирд╣реЛрд╡рд░',
рджрд┐рдЦрд╛рдПрдБ: рдЭреВрдард╛,
рдЪреМрдбрд╝рд╛рдИ: 300,
рдКрдВрдЪрд╛рдИ: 350,
рд╡реЗрдм рд╡рд░реАрдпрддрд╛рдПрдБ: {
рдиреЛрдб рдПрдХреАрдХрд░рдг: рд╕рдЪ,
рдкреНрд░реАрд▓реЛрдб: __dirname + '/preload.js'
}
});
```
**
Preload.js`**:
javascript
window.ipcRenderer = require('electron').ipcRenderer;
рдореИрдВ рдХреНрдпрд╛ рдЦреЛ рд░рд╣рд╛ рд╣реВрдБ?
рддреЛ, рд╕рдорд╕реНрдпрд╛ рд╣рд▓ рд╣реЛ рдЧрдИред рдореИрдВ рдЦреБрдж рдХреЛ рдЬрд╡рд╛рдм рджреЗрддрд╛ рд╣реВрдВ рдХреНрдпреЛрдВрдХрд┐ рд╢рд╛рдпрдж рдХрд┐рд╕реА рдХреЛ рдЗрд╕рд╕реЗ рдлрд╛рдпрджрд╛ рд╣реЛ рд╕рдХрддрд╛ рд╣реИ (рдореИрдВ рдШрдВрдЯреЛрдВ рддрдХ рдЕрдЯрдХрд╛ рд░рд╣рд╛)ред рдпрджрд┐ рдЖрдкрдХреЗ рдкрд╛рд╕ Preload.js
рдлрд╝рд╛рдЗрд▓ рд╣реИ, рддреЛ рдЖрдкрдХреЛ ├Аpp.js
(рд░реЗрдВрдбрд░рд░) рд╕реЗ window.require('electron').ipcRenderer
рдХреЛ рдлрд┐рд░ рд╕реЗ рдХреЙрд▓ рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рдирд╣реАрдВ рд╣реИ; рдЖрдк рд╕реАрдзреЗ рд╡реИрд░рд┐рдПрдмрд▓ рдХреЛ window.ipcRenderer
рдЗрд╕ рддрд░рд╣ рдХрд╣рддреЗ рд╣реИрдВ:
App.js
:
````рдЬрд╛рд╡рд╛рд╕реНрдХреНрд░рд┐рдкреНрдЯ
'рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛' рд╕реЗ рдЖрдпрд╛рдд рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛, {useEffect, useState};
рдЖрдпрд╛рдд './App.css';
рдлрд╝рдВрдХреНрд╢рди рдРрдк () {
useEffect( () => {
window.ipcRenderer.on('ping', (event, message) => { console.log(message) });
}, []);
return (
<div className = 'App'>
<div className = 'Header-Arrow'></div>
<div className = 'Box'>
<p>Press тМШ + тЗз + 4</p>
</div>
</div>
);
}
рдирд┐рд░реНрдпрд╛рдд рдбрд┐рдлрд╝реЙрд▓реНрдЯ рдРрдк;
````
Main.js
рдкрд░ рдореЗрдирд╡рд┐рдВрдбреЛ рдЪрд░:
javascript
// Create the browser window.
mainWindow = new BrowserWindow({
alwaysOnTop: true,
frame: false,
fullscreenable: false,
transparent: true,
titleBarStyle: 'customButtonsOnHover',
show: false,
width: 300,
height: 350,
webPreferences: {
nodeIntegration: true,
preload: __dirname + '/preload.js'
}
});
Preload.js
:
javascript
window.ipcRenderer = require('electron').ipcRenderer;
рдХрдорд╛рдВрдб рд▓рд╛рдЗрди рд╕реЗ рдРрдк рдЪрд▓рд╛рдиреЗ рдХреЗ рдмрд╛рдж, рд░рд┐рдПрдХреНрдЯ рдкреНрд░рдХреНрд░рд┐рдпрд╛ рджреНрд╡рд╛рд░рд╛ рдЙрддреНрдкрдиреНрди рд╡рд┐рдВрдбреЛ рдПрдХ рддреНрд░реБрдЯрд┐ рджреЗрдЧреА (ipcRenderer рдЕрдкрд░рд┐рднрд╛рд╖рд┐рдд рд╣реИ)ред рдЕрдирджреЗрдЦреА рдХрд░реЛ рдЗрд╕реЗред рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдкреНрд░рдХреНрд░рд┐рдпрд╛ (рдореБрдЦреНрдп рдРрдк) рджреНрд╡рд╛рд░рд╛ рдЙрддреНрдкрдиреНрди рд╡рд┐рдВрдбреЛ рдареАрдХ рдХрд╛рдо рдХрд░реЗрдЧреАред
Create-React-App 2 рдХреЗ рд╕рд╛рде, рдЖрдк
craco
npm рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ:https://www.npmjs.com/package/@craco/craco
рдЕрдкрдиреЗ рдкреИрдХреЗрдЬ рдореЗрдВ
react-scripts
рдХреЛcraco
рд╕реЗ рдмрджрд▓реЗрдВредjsoncraco.config.js
module.exports = { webpack: { configure: { target: 'electron-renderer' } } };
require("fs")
рдХреЗ рд╕рд╛рде-рд╕рд╛рде window.require("fs")
рдХреЗ рджреМрд░рд╛рди рдореБрдЭреЗ рд╕рдорд╕реНрдпрд╛рдПрдВ рдереАрдВред рдЗрд╕ рдЪрд░реНрдЪрд╛ рдореЗрдВ CRACO рдХреЛ рдкреЗрд╢ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП @Maxou44 рдХреЛ рдзрдиреНрдпрд╡рд╛рджред
рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдореИрдВрдиреЗ рдЕрдкрдиреА рдкрд░рд┐рдпреЛрдЬрдирд╛ рдореЗрдВ 3 рдмрджрд▓рд╛рд╡ рдХрд┐рдП рд╣реИрдВ:
new BrowserWindow({ width: 1200, height: 800 })
new BrowserWindow({ width: 1200, height: 800, webPreferences: { nodeIntegration: true } })
const fs = require("fs")
рд╕реЗ const fs = require("electron").remote.require("fs")
. рдореЗрдВ рдмрджрд▓рд╛ рдЧрдпрд╛рдЕрдзрд┐рдХ рд╕реНрдкрд╖реНрдЯреАрдХрд░рдг рдХреЗ рд▓рд┐рдП @wwlib рджреНрд╡рд╛рд░рд╛ рдЗрд╕ рдЧрд┐рдЯ рд░реЗрдкреЛ рдХреЛ рджреЗрдЦреЗрдВ https://github.com/wwlib/cra-craco-electron-example
рдореИрдВрдиреЗ рдКрдкрд░ рд╕реЗ рдиреАрдЪреЗ рддрдХ рдкреВрд░рд╛ рдзрд╛рдЧрд╛ рдкрдврд╝рд╛ рдФрд░ рдХреБрдЫ рднреА рдХрд╛рдо рдирд╣реАрдВ рдХрд┐рдпрд╛ред
рд╕рд┐рд╡рд╛рдп, @ рд╕рд░реВрдкрд╢реНрд░реА рдХреА рд╡рд┐рдзрд┐ рдКрдкрд░ред рд╕рдорд╛рдзрд╛рди рд╕рд╛рдЭрд╛ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж @ рд╕рд░реВрдкрд╢реНрд░реА ред
рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдереНрд░реЗрдб рдХреА рд╢реБрд░реБрдЖрдд рдХреЗ рдмрд╛рдж рд╕реЗ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдФрд░ рд╡реЗрдмрдкреИрдХ рдХреБрдЫ рд╣рдж рддрдХ рдмрджрд▓ рдЧрдП рд╣реИрдВ, рдЙрдкрд░реЛрдХреНрдд рд╕рдорд╛рдзрд╛рди рдЕрдкреНрд░рдЪрд▓рд┐рдд рд╣реИрдВред рдореИрдВ рдЧрд▓рдд рд╣реЛ рд╕рдХрддрд╛ рд╣реВрдВ рд▓реЗрдХрд┐рди рдЙрдкрд░реЛрдХреНрдд рд╡рд┐рдзрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрд╛рдо рдХрд┐рдпрд╛ред
рдпрд╣ рдЬреЛ рдореИрдВрдиреЗ рдХрд┐рдпрд╛ рд╣реИ:
npm install craco -D
module.exports = {
webpack: {
configure: {
target: 'electron-renderer'
}
}
};
new BrowserWindow({ width: 1200, height: 800, webPreferences: { nodeIntegration: true } })
рдЕрдкрдбреЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛ред рдмрд┐рд▓реНрдХреБрд▓ рдЕрд▓рдЧ рдЪреМрдбрд╝рд╛рдИ рдФрд░ рдКрдВрдЪрд╛рдИ рдХреЗ рд╕рд╛рдередnpm start
рджреМрдбрд╝рд╛ред рдЗрд╕рдиреЗ рд╕рдорд╛рди рддреНрд░реБрдЯрд┐рдпреЛрдВ рд╡рд╛рд▓рд╛ рдПрдХ рдЯреИрдм рдЦреЛрд▓рд╛ред рдФрд░ рдореБрдЭреЗ рдлрд┐рд░ рд╕реЗ рдердХрд╛рди рдорд╣рд╕реВрд╕ рд╣реБрдИредnpm run electron
рджреМрдбрд╝рд╛редрддреЛ рдзрдиреНрдпрд╡рд╛рдж @Saroopashreeред
рдпрджрд┐ рдЖрдк рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдШрдЯрдХ/рд╡рд░реНрдЧ рдХреЗ рдЕрдВрджрд░ 'рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди' рдпрд╛ рдЙрд╕рдХреЗ рдЕрдиреНрдп рдШрдЯрдХ рддрдХ рдкрд╣реБрдВрдЪрдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рддреЛ рдЗрд╕реЗ рдЖрдЬрдорд╛рдПрдВ: #336757899
рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рд╕рдорд╛рдзрд╛рди рдХреЗ рд▓рд┐рдВрдХ рдХреЛ рдкреЛрд╕реНрдЯ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП @tumbledwyer рдХреЛ рдзрдиреНрдпрд╡рд╛рдж:
рдЕрдкрдбреЗрдЯ рдХрд┐рдпрд╛ рдЧрдпрд╛:
рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдРрд╕рд╛ рдХрд░рдиреЗ рдХрд╛ рджреВрд╕рд░рд╛ рд╕рдВрд╕реНрдХрд░рдг: https://www.codementor.io/randyfindley/how-to-build-an-electron-app-use-create-react-app-and-electron-builder-ss1k0sfer
рд░реИрдВрдбреА рдлрд╛рдЗрдВрдбрд▓реА рд╕реЗ рд╕рдорд╛рдзрд╛рди:
рдЕрдм, рдЕрдЧрд░ рдЖрдкрдХреЛ рдореЗрд░реЗ рдЬреИрд╕реЗ fs
рдореЙрдбреНрдпреВрд▓ рддрдХ рдкрд╣реБрдВрдЪрдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ, рддреЛ рдЖрдк рдЬрд▓реНрджреА рд╕реЗ Module not found
рддреНрд░реБрдЯрд┐ рдкрд░ рдкрд╣реБрдВрдЪ рдЬрд╛рдПрдВрдЧреЗ
рд╕рдмрд╕реЗ рдкрд╣рд▓реЗ, рдкреНрд░рддрд┐рд▓реЗрдЦ рд╕реНрдерд╛рдкрд┐рдд рдХрд░реЗрдВред
yarn add @rescripts/cli @rescripts/rescript-env --dev
рдлрд┐рд░, рдЗрд╕ рд╕реЗ package.json рдореЗрдВ рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдЯреИрдЧ рдмрджрд▓реЗрдВ...
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
рдЗрд╕рдХреЗ рд▓рд┐рдпреЗ
"start": "rescripts start",
"build": "rescripts build",
"test": "rescripts test",
рдЕрдм рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╕рд╛рдордЧреНрд░реА рдХреЗ рд╕рд╛рде .rescriptsrc.js
рдирд╛рдордХ рдПрдХ рдирдИ рдлрд╝рд╛рдЗрд▓ рдЬреЛрдбрд╝реЗрдВ:
module.exports = [require.resolve('./.webpack.config.js')]
рдЕрдВрдд рдореЗрдВ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╕рд╛рдордЧреНрд░реА рдХреЗ рд╕рд╛рде .webpack.config.js
рдирд╛рдордХ рдПрдХ рдФрд░ рдирдИ рдлрд╝рд╛рдЗрд▓ рдЬреЛрдбрд╝реЗрдВ:
// define child rescript
module.exports = config => {
config.target = 'electron-renderer';
return config;
}
рдЕрдм рдЖрдк fs
рдореЙрдбреНрдпреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ, рдХреЛрдИ рдЪрд┐рдВрддрд╛ рдирд╣реАрдВред
рдЯрд╛рдЗрдкрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдФрд░ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рд╕рд╛рде рд╕реАрдЖрд░рдП рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реБрдП @ledleds рдиреЗ рдореЗрд░реЗ рд▓рд┐рдП рдХреНрдпрд╛ рдХрд╛рдо рдХрд┐рдпрд╛ред рддреЛ рдмрд╛рдд рдпрд╣ рд╣реИ рдХрд┐ рдореИрдВрдиреЗ рдЗрд╕ рддрд░рд╣ рд╡реЗрдмрдкреНрд░реЗрдлрд░реЗрдВрд╕ рдШреЛрд╖рд┐рдд рдХрд┐рдпрд╛ рд╣реИ:
webPreferences: {
preload: path.join(__dirname, 'preload.js')
},
рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдУрд╡рд░рд░рд╛рдЗрдЯрд┐рдВрдЧ/рдиреЛрдб рдЗрдВрдЯреАрдЧреНрд░реЗрд╢рди рдХреЛ рдЧрд▓рдд рдкрд░ рд╕реЗрдЯ рдХрд░ рд░рд╣рд╛ рд╣реИ, рдЗрд╕рд▓рд┐рдП рдЗрд╕реЗ рд╕рд╣реА рдкрд░ рд╕реЗрдЯ рдХрд░рдирд╛ рдФрд░ рдРрдк рдХреЛ рдлрд┐рд░ рд╕реЗ рд▓реЙрдиреНрдЪ рдХрд░рдиреЗ рд╕реЗ рд╕рдорд╕реНрдпрд╛ рд╣рд▓ рд╣реЛ рдЧрдИ рд╣реИ (рдЖрдкрдХреЛ рдЙрд╕ рдХреЙрдиреНрдлрд╝рд┐рдЧрд░реЗрд╢рди рдХреЗ рд╕рд╛рде рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╡рд┐рдВрдбреЛ рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдРрдк рдХреЛ рдлрд┐рд░ рд╕реЗ рд▓реЙрдиреНрдЪ рдХрд░рдирд╛ рд╣реЛрдЧрд╛)
рдиреЛрдбрдЗрдВрдЯреАрдЧреНрд░реЗрд╢рди рдХреЛ рдЗрд╕ рддрд░рд╣ рд╕рд╣реА рдкрд░ рд╕реЗрдЯ рдХрд░рдирд╛
webPreferences: {
preload: path.join(__dirname, 'preload.js'),
nodeIntegration: true
},
рдХрд┐рд╕реА рдХреЗ рд▓рд┐рдП рдЕрднреА рднреА рдЗрд╕ рдкрд░ рдЕрдЯрдХрд╛ рд╣реБрдЖ рд╣реИ: рдЖрдкрдХреЛ рддреНрд░реБрдЯрд┐
window.require is not a function
рдорд┐рд▓реЗрдЧреА рдЬрдм рддрдХ рдХрд┐ рдЖрдк рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗnodeIntergation
рдХреЛtrue
рдХреЗ рд░реВрдк рдореЗрдВ рдШреЛрд╖рд┐рдд рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВ рдЬрдм рдЖрдк рдЕрдкрдирд╛BrowserWindow
рдШреЛрд╖рд┐рдд рдХрд░рддреЗ рд╣реИрдВ:new BrowserWindow({ webPreferences: { nodeIntegration: true, } });
рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдРрдк-рд░рд┐рд╡рд╛рдпрд░реНрдб
рд╕реНрдХреЗрд▓реЗрдмрд┐рд▓рд┐рдЯреА рдХреЗ рдорд╛рдорд▓реЗ рдореЗрдВ рдореБрдЭреЗ рдпрд╣реА рдПрдХрдорд╛рддреНрд░ рдЕрдЪреНрдЫрд╛ рд╕рдорд╛рдзрд╛рди рдорд┐рд▓рд╛, рдореБрдЭреЗ рдирд╣реАрдВ рд▓рдЧрддрд╛ рдХрд┐ рдХрд┐рд╕реА рдХреЛ рд╡рд┐рдВрдбреЛ рдкрд░ рднрд░реЛрд╕рд╛ рдХрд░рдирд╛ рдЪрд╛рд╣рд┐рдПред рдЖрд╡рд╢реНрдпрдХрддрд╛
window.require рд╕реНрдХреЗрд▓реЗрдмрд▓ рдХреНрдпреЛрдВ рдирд╣реАрдВ рд╣реЛрдЧрд╛?
рдХрд┐рд╕реА рдХреЗ рд▓рд┐рдП рднреА рдЬреЛ рдЗрд╕ рдпрд╛ рдЗрд╕реА рддрд░рд╣ рдХреЗ рдореБрджреНрджреЛрдВ рд╕реЗ рдЬреВрдЭ рд░рд╣рд╛ рд╣реИ рдФрд░ Vue рдФрд░ Vue-electron-builder рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реИ, рдпрд╣рд╛рдВ рджреЗрдЦреЗрдВ
рдХрд┐рд╕реА рднреА рд╡реНрдпрдХреНрддрд┐ рдХреЗ рд▓рд┐рдП рдЬреЛ рдЕрднреА рднреА рдЗрд╕рд╕реЗ рдЬреВрдЭ рд░рд╣рд╛ рд╣реИ, рд╡рд┐рд╢реЗрд╖ рд░реВрдк рд╕реЗ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдмрдЯрди рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдПрдкреНрд▓рд┐рдХреЗрд╢рди рдХреЛ рдЫреЛрдбрд╝рдиреЗ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдХреГрдкрдпрд╛ рдкрдврд╝реЗрдВред
рдореЗрд░реЗ рд▓рд┐рдП рдЬреЛ рдорджрдж рдХреА рд╡рд╣ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдереА:
рдЬрдм рдЖрдк рдЕрдкрдиреА рд╡рд┐рдВрдбреЛ рдХреА рдШреЛрд╖рдгрд╛ рдХрд░рддреЗ рд╣реИрдВ рддреЛ рд╕реБрдирд┐рд╢реНрдЪрд┐рдд рдХрд░реЗрдВ рдХрд┐ рдЖрдкрдиреЗ nodeIntegration: true
рд╕реЗрдЯ рдХрд┐рдпрд╛ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рд╕реБрд░рдХреНрд╖рд╛ рдХрд╛рд░рдгреЛрдВ рд╕реЗ рдпрд╣ рд╡рд░реНрддрдорд╛рди рдореЗрдВ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд░реВрдк рд╕реЗ false
рд╣реИред рдЖрдорддреМрд░ рдкрд░ рдпрд╣ рдЖрдкрдХреА electron.js
рдлрд╝рд╛рдЗрд▓ рдореЗрдВ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред
рдЬреИрд╕рд╛ рдХрд┐ @packetstracer рдиреЗ рдкрд╣рд▓реЗ рд╣реА рдЙрд▓реНрд▓реЗрдЦ рдХрд┐рдпрд╛ рд╣реИ: _рдЖрдкрдХреЛ рдЙрд╕ рдХреЙрдиреНрдлрд╝рд┐рдЧрд░реЗрд╢рди рдХреЗ рд╕рд╛рде рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рд╡рд┐рдВрдбреЛ рд▓реЛрдб рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдРрдк рдХреЛ рдлрд┐рд░ рд╕реЗ рд▓реЙрдиреНрдЪ рдХрд░рдирд╛ рд╣реЛрдЧрд╛_
mainWindow = new BrowserWindow({
//...
webPreferences: {
nodeIntegration: true,
},
});
electron.js
рдореЗрдВ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдХрдерди рдХреЛ рд╢реАрд░реНрд╖ рдХреЗ рдкрд╛рд╕ рд░рдЦреЗрдВ рдпрд╣ рд╕реБрдирд┐рд╢реНрдЪрд┐рдд рдХрд░рддрд╛ рд╣реИ рдХрд┐ ipcMain
рдШрдЯрдирд╛ _"рдХреНрд▓реЛрдЬ-рдореА"_ рдкрд░ рд╕реБрдиреЗрдЧрд╛:const { ipcMain } = require("electron");
ipcMain.on("close-me", (evt, arg) => {
app.quit();
});
window.require
рд╡рд┐рд╡рд░рдг рдЬреЛрдбрд╝реЗрдВред рд╕рд╛рдорд╛рдиреНрдп require
рдХрд╛рдо рдирд╣реАрдВ рдХрд┐рдпрд╛:const ipcRenderer = window.require("electron").ipcRenderer;
<Button label="close" onClick={(e) => ipcRenderer.send("close-me")} />
рдЯрд┐рдкреНрдкрдгреА рдХрд░рдиреЗ рдФрд░ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рджреЗрдиреЗ рдХреЗ рд▓рд┐рдП рд╕реНрд╡рддрдВрддреНрд░ рдорд╣рд╕реВрд╕ рдХрд░реЗрдВ рдореИрдВ рдЕрднреА рднреА рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдХреЗ рд▓рд┐рдП рдирдпрд╛ рд╣реВрдВред
рдореБрдЭреЗ рдкрддрд╛ рд╣реИ рдХрд┐ рдЫреЛрдбрд╝реЗрдВ рдмрдЯрди рдХреЗ рд╕рд╛рде рд╕рдВрджрд░реНрдн рдЕрд╕рдВрдмрдВрдзрд┐рдд рд╣реИ рд▓реЗрдХрд┐рди рдореБрдЭреЗ рдПрдХ рдмреЗрд╣рддрд░ рдЙрдкрдпреБрдХреНрдд рдзрд╛рдЧрд╛ рдирд╣реАрдВ рдорд┐рд▓рд╛ред рдХреГрдкрдпрд╛ рдмреЗрдЭрд┐рдЭрдХ рдореБрдЭреЗ рдХрд┐рд╕реА рдЕрдиреНрдп рдЙрдкрдпреБрдХреНрдд рд╕реВрддреНрд░ рдХреА рдУрд░ рдЗрдВрдЧрд┐рдд рдХрд░реЗрдВ, рдпрджрд┐ рдХреЛрдИ рд╣реЛред
рдореЗрд░рд╛ рд╡рд┐рдиреНрдпрд╛рд╕:
"electron": "9.2.0",
"electron-builder": "22.8.0",
"electron-packager": "15.0.0",
рдореЗрд░реЗ рд▓рд┐рдП рд╣рд▓ !! рдзрдиреНрдпрд╡рд╛рдж @ nukeop
`
`
рдХреНрдпрд╛ рдХрд┐рд╕реА рдХреЛ рдкрддрд╛ рд╣реИ рдХрд┐ рдЯрд╛рдЗрдкрдкреНрд░рддрд┐ рдореЗрдВ рдЙрдЪрд┐рдд рдкреНрд░рдХрд╛рд░ рдХреИрд╕реЗ рд╕реНрдерд╛рдкрд┐рдд рдХрд┐рдпрд╛ рдЬрд╛рдП?
рдореЗрд░реЗ рдкрд╛рд╕ рдЗрд╕ рд╕рдордп рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рд╣реИ
export const electron = window.require('electron').remote
рдореБрдЭреЗ рдХреБрдЫ рдкрд╕рдВрдж рд╣реИ
export const electron = window.require('electron').remote as ElectronType
рдЗрд╕рд▓рд┐рдП рдЖрдИрдбреАрдИ рдЬрд╛рдирддрд╛ рд╣реИ рдХрд┐ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдПрдкреАрдЖрдИ рдХреЛ рд╕реНрд╡рдд: рдкреВрд░реНрдг рдХреИрд╕реЗ рдХрд░реЗрдВред
@timsamart рдпрд╣ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИред рдзрдиреНрдпрд╡рд╛рдж, рдпрд╣ рдореБрдЭреЗ рдХрд╛рдо рдХреЗ рджрд┐рди рдмрдЪрд╛рддрд╛ рд╣реИред рдореИрдВ
рдЙрдкрд░реЛрдХреНрдд рд╕рднреА рдЪреАрдЬреЛрдВ рдХрд╛ рд╢рд╛рдмреНрджрд┐рдХ рд░реВрдк рд╕реЗ рдкреНрд░рдпрд╛рд╕ рдХрд░рдиреЗ рдореЗрдВ рдХрдИ рдШрдВрдЯреЗ рдмрд┐рддрд╛рдиреЗ рдХреЗ рдмрд╛рдж, рдпрджрд┐ рдЖрдк BrowserView
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВ, рддреЛ рдореИрдВ рдЙрд╕ рд╣рд┐рд╕реНрд╕реЗ рд╕реЗ рдЪреВрдХ рдЧрдпрд╛, рдЬреИрд╕реЗ BrowserWindow
рдЖрдкрдХреЛ рд╕реНрдкрд╖реНрдЯ рд░реВрдк рд╕реЗ node.js рдХреЛ рд╕рдХреНрд╖рдо рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИ:
new BrowserView({ // is a BrowserView not a BrowserWindow
webPreferences: {
nodeIntegration: true,
},
})
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
рднрд╡рд┐рд╖реНрдп рдореЗрдВ рдЗрд╕ рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рд╛рдордирд╛ рдХрд░рдиреЗ рд╡рд╛рд▓реЗ рдФрд░ рдЗрд╕ рдзрд╛рдЧреЗ рдХреЛ рдкрдврд╝рдиреЗ рд╡рд╛рд▓реЗ рдХрд┐рд╕реА рднреА рд╡реНрдпрдХреНрддрд┐ рдХреЗ рд▓рд┐рдП, рдЖрд╡рд╢реНрдпрдХрддрд╛ рдХреЗ рдмрдЬрд╛рдп
window.require
рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЗрд▓реЗрдХреНрдЯреНрд░реЙрди рдФрд░ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдХреЗrequire
рдлрд╝рдВрдХреНрд╢рди рдХреЗ рдмреАрдЪ рд╕рдВрдШрд░реНрд╖ рд╕реЗ рдмрдЪрдиреЗ рдХреА рдПрдХ рд╕рдВрднрд╛рд╡рдирд╛ рд╣реИред