Skip to content

Commit 6c76898

Browse files
nklaymannklayman
committed
fix(serve): Electron not using project name, closes #74 
1 parent 31fb736 commit 6c76898

File tree

5 files changed

+120
-96
lines changed

5 files changed

+120
-96
lines changed

‎__tests__/commands.spec.js

Lines changed: 17 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,8 @@ const runCommand = async (command, options = {}, args = {}, rawArgs = []) => {
8383
// #endregion
8484

8585
describe('build:electron', () => {
86+
process.env.NODE_ENV = 'production'
87+
8688
test('typescript is disabled when set in options', async () => {
8789
await runCommand('build:electron', {
8890
pluginOptions: {
@@ -250,6 +252,8 @@ describe('build:electron', () => {
250252
})
251253

252254
describe('serve:electron', () => {
255+
process.env.NODE_ENV = 'development'
256+
253257
test('typescript is disabled when set in options', async () => {
254258
await runCommand('serve:electron', {
255259
pluginOptions: {
@@ -461,6 +465,17 @@ describe('serve:electron', () => {
461465
expect(mockExeca.stderr.pipe).toBeCalledWith(process.stderr)
462466
expect(mockExeca.stdout.pipe).toBeCalledWith(process.stdout)
463467
})
468+
469+
test('package.json is copied', async () => {
470+
await runCommand('serve:electron', {
471+
pluginOptions: { electronBuilder: { outputDir: 'outputDir' } }
472+
})
473+
474+
expect(fs.copySync).toBeCalledWith(
475+
`projectPath/./package.json`,
476+
'outputDir/package.json'
477+
)
478+
})
464479
})
465480

466481
describe('Custom webpack chain', () => {
@@ -528,8 +543,8 @@ describe('testWithSpectron', async () => {
528543
// Proper URL is returned
529544
expect(url).toBe('http://localhost:1234/')
530545
const appArgs = Application.mock.calls[0][0]
531-
// Spectron is launched with proper path to background
532-
expect(appArgs.args).toEqual(['customOutput/background.js'])
546+
// Spectron is launched with proper path to output dir
547+
expect(appArgs.args).toEqual(['customOutput'])
533548
})
534549

535550
test('secures an open port with portfinder', async () => {

‎__tests__/serve.helper.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ const serve = (project, notifyUpdate) =>
1717
try {
1818
if (
1919
data.match(
20-
// Dev server is finished and background.js is created
20+
// Dev server is finished and index.js is created
2121
/Not launching electron as debug argument was passed\. You must launch electron though your debugger\./
2222
)
2323
) {
@@ -46,11 +46,11 @@ const runTests = useTS =>
4646
path.join(process.cwd(), '__tests__/projects/' + projectName, p)
4747
// Wait for dev server to start
4848
const { stopServe } = await serve(project)
49-
expect(project.has('dist_electron/background.js')).toBe(true)
49+
expect(project.has('dist_electron/index.js')).toBe(true)
5050
// Launch app with spectron
5151
const app = new Application({
5252
path: electronPath,
53-
args: [projectPath('dist_electron/background.js')],
53+
args: [projectPath('dist_electron')],
5454
env: {
5555
IS_TEST: true
5656
},

‎docs/guide/guide.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ console.log(fileContents)
8282
│ ├── bundled/.. # where webpack outputs compiled files
8383
│ ├── [target platform]-unpacked/.. # unpacked Electron app (main app and supporting files)
8484
│ ├── [application name] setup [version].[target binary (exe|dmg|rpm...)] # installer for Electron app
85-
│ ├── background.js # compiled background file used for serve:electron
85+
│ ├── index.js # compiled background file used for serve:electron
8686
│ └── ...
8787
├── public/ # Files placed here will be available through __static or process.env.BASE_URL
8888
├── src/

‎index.js

Lines changed: 98 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ module.exports = (api, options) => {
1515
const usesTypescript = pluginOptions.disableMainProcessTypescript
1616
? false
1717
: api.hasPlugin('typescript')
18-
const mainProcessTypeChecking = pluginOptions.mainProcessTypeChecking || false
1918
const outputDir = pluginOptions.outputDir || 'dist_electron'
2019
const mainProcessFile =
2120
pluginOptions.mainProcessFile ||
@@ -87,40 +86,6 @@ module.exports = (api, options) => {
8786
// Enable modern mode unless --legacy is passed
8887
modern: !args.legacy
8988
}
90-
const mainConfig = new Config()
91-
// Configure main process webpack config
92-
mainConfig
93-
.mode('production')
94-
.target('electron-main')
95-
.node.set('__dirname', false)
96-
.set('__filename', false)
97-
// Set externals
98-
mainConfig.externals(getExternals(api, pluginOptions))
99-
mainConfig.output
100-
.path(api.resolve(outputDir + '/bundled'))
101-
.filename('background.js')
102-
// Set __static to __dirname (files in public get copied here)
103-
mainConfig
104-
.plugin('define')
105-
.use(webpack.DefinePlugin, [{ __static: '__dirname' }])
106-
mainConfig.plugin('uglify').use(UglifyJSPlugin, [
107-
{
108-
parallel: true
109-
}
110-
])
111-
mainConfig
112-
.plugin('env')
113-
.use(webpack.EnvironmentPlugin, [{ NODE_ENV: 'production' }])
114-
mainConfig.entry('background').add(api.resolve(mainProcessFile))
115-
if (usesTypescript) {
116-
mainConfig.resolve.extensions.merge(['.js', '.ts'])
117-
mainConfig.module
118-
.rule('ts')
119-
.test(/\.ts$/)
120-
.use('ts-loader')
121-
.loader('ts-loader')
122-
.options({ transpileOnly: !mainProcessTypeChecking })
123-
}
12489
// Set the base url so that the app protocol is used
12590
options.baseUrl = './'
12691
console.log('Bundling render process:')
@@ -135,7 +100,16 @@ module.exports = (api, options) => {
135100
)
136101
}
137102
// Build the main process into the renderer process output dir
138-
const bundle = webpack(mainProcessChain(mainConfig).toConfig())
103+
const bundle = bundleMain({
104+
mode: 'build',
105+
api,
106+
args,
107+
pluginOptions,
108+
outputDir,
109+
mainProcessFile,
110+
mainProcessChain,
111+
usesTypescript
112+
})
139113
console.log('Bundling main process:\n')
140114
bundle.run((err, stats) => {
141115
if (err) {
@@ -206,46 +180,6 @@ module.exports = (api, options) => {
206180
mainProcessFile,
207181
...(pluginOptions.mainProcessWatch || [])
208182
]
209-
// Configure webpack for main process
210-
const mainConfig = new Config()
211-
mainConfig
212-
.mode('development')
213-
.target('electron-main')
214-
.node.set('__dirname', false)
215-
.set('__filename', false)
216-
mainConfig.output.path(api.resolve(outputDir)).filename('background.js')
217-
if (args.debug) {
218-
// Enable source maps for debugging
219-
mainConfig.devtool('source-map')
220-
} else {
221-
// Minify for better performance
222-
mainConfig.plugin('uglify').use(UglifyJSPlugin, [
223-
{
224-
parallel: true
225-
}
226-
])
227-
}
228-
// Set __static to absolute path to public folder
229-
mainConfig.plugin('define').use(webpack.DefinePlugin, [
230-
{
231-
__static: JSON.stringify(api.resolve('./public'))
232-
}
233-
])
234-
mainConfig
235-
.plugin('env')
236-
.use(webpack.EnvironmentPlugin, [{ NODE_ENV: 'development' }])
237-
mainConfig.entry('background').add(api.resolve(mainProcessFile))
238-
// Set external (native) deps
239-
mainConfig.externals(getExternals(api, pluginOptions))
240-
if (usesTypescript) {
241-
mainConfig.resolve.extensions.merge(['.js', '.ts'])
242-
mainConfig.module
243-
.rule('ts')
244-
.test(/\.ts$/)
245-
.use('ts-loader')
246-
.loader('ts-loader')
247-
.options({ transpileOnly: !mainProcessTypeChecking })
248-
}
249183

250184
console.log('\nStarting development server:\n')
251185
// Run the serve command
@@ -255,17 +189,8 @@ module.exports = (api, options) => {
255189
dashboard: args.dashboard
256190
})
257191

258-
// Set dev server url
259-
mainConfig.plugin('env').tap(args => [
260-
{
261-
// Existing env values
262-
...args,
263-
// Dev server url
264-
WEBPACK_DEV_SERVER_URL: server.url,
265-
// Path to node_modules (for externals in development)
266-
NODE_MODULES_PATH: api.resolve('./node_modules')
267-
}
268-
])
192+
// Copy package.json so electron can detect app's name
193+
fs.copySync(api.resolve('./package.json'), `${outputDir}/package.json`)
269194
// Electron process
270195
let child
271196
// Function to bundle main process and start Electron
@@ -277,7 +202,17 @@ module.exports = (api, options) => {
277202
child.kill()
278203
}
279204
// Build the main process
280-
const bundle = webpack(mainProcessChain(mainConfig).toConfig())
205+
const bundle = bundleMain({
206+
mode: 'serve',
207+
api,
208+
args,
209+
pluginOptions,
210+
outputDir,
211+
mainProcessFile,
212+
mainProcessChain,
213+
usesTypescript,
214+
server
215+
})
281216
console.log('Bundling main process:\n')
282217
bundle.run((err, stats) => {
283218
if (err) {
@@ -326,7 +261,7 @@ module.exports = (api, options) => {
326261
child = execa(
327262
require('electron'),
328263
// Have it load the main process file built with webpack
329-
[`${outputDir}/background.js`],
264+
[outputDir],
330265
{
331266
cwd: api.resolve('.'),
332267
env: {
@@ -367,6 +302,80 @@ module.exports = (api, options) => {
367302
}
368303
)
369304
}
305+
306+
function bundleMain ({
307+
mode,
308+
api,
309+
args,
310+
pluginOptions,
311+
outputDir,
312+
mainProcessFile,
313+
mainProcessChain,
314+
usesTypescript,
315+
server
316+
}) {
317+
const mainProcessTypeChecking = pluginOptions.mainProcessTypeChecking || false
318+
const isBuild = mode === 'build'
319+
const NODE_ENV = process.env.NODE_ENV
320+
const config = new Config()
321+
config
322+
.mode(NODE_ENV)
323+
.target('electron-main')
324+
.node.set('__dirname', false)
325+
.set('__filename', false)
326+
// Set externals
327+
config.externals(getExternals(api, pluginOptions))
328+
329+
config.output
330+
.path(api.resolve(outputDir + (isBuild ? '/bundled' : '')))
331+
// Electron will not detect background.js on dev server, only index.js
332+
.filename(isBuild ? 'background.js' : 'index.js')
333+
if (isBuild) {
334+
// Set __static to __dirname (files in public get copied here)
335+
config
336+
.plugin('define')
337+
.use(webpack.DefinePlugin, [{ __static: '__dirname' }])
338+
} else {
339+
// Set __static to public folder
340+
config.plugin('define').use(webpack.DefinePlugin, [
341+
{
342+
__static: JSON.stringify(api.resolve('./public'))
343+
}
344+
])
345+
config.plugin('env').use(webpack.EnvironmentPlugin, [
346+
{
347+
// Dev server url
348+
WEBPACK_DEV_SERVER_URL: server.url,
349+
// Path to node_modules (for externals in development)
350+
NODE_MODULES_PATH: api.resolve('./node_modules')
351+
}
352+
])
353+
}
354+
if (args.debug) {
355+
// Enable source maps for debugging
356+
config.devtool('source-map')
357+
} else if (NODE_ENV === 'production') {
358+
// Minify for better performance
359+
config.plugin('uglify').use(UglifyJSPlugin, [
360+
{
361+
parallel: true
362+
}
363+
])
364+
}
365+
config.entry('background').add(api.resolve(mainProcessFile))
366+
if (usesTypescript) {
367+
config.resolve.extensions.merge(['.js', '.ts'])
368+
config.module
369+
.rule('ts')
370+
.test(/\.ts$/)
371+
.use('ts-loader')
372+
.loader('ts-loader')
373+
.options({ transpileOnly: !mainProcessTypeChecking })
374+
}
375+
mainProcessChain(config)
376+
return webpack(config.toConfig())
377+
}
378+
370379
module.exports.defaultModes = {
371380
'build:electron': 'production',
372381
'serve:electron': 'development'

‎lib/testWithSpectron.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ module.exports = (options = {}) =>
4242
const spectronOptions = merge(
4343
{
4444
path: electronPath,
45-
args: [`${outputDir}/background.js`],
45+
args: [`${outputDir}`],
4646
env: {
4747
IS_TEST: true
4848
},

0 commit comments

Comments
 (0)