Skip to content

Commit 95c333e

Browse files
adambullmeradambullmer
committed
DRY generator code, refactor some functions to make more readable
1 parent b7808b0 commit 95c333e

File tree

3 files changed

+86
-121
lines changed

3 files changed

+86
-121
lines changed

‎generator/index.js‎

Lines changed: 36 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -1,75 +1,69 @@
1-
const fs = require('fs')
21
const path = require('path')
32
const { generateKey } = require('../lib/signing-key')
4-
const gitignoreRules = ['# Vue Browser Extension Output', '*.pem', '*.pub', '*.zip', '/artifacts']
5-
6-
function regexEscape (rule) {
7-
return rule.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
8-
}
3+
const { renderDomain, renderGitignore, renderTs } = require('../lib/render')
94

105
module.exports = (api, _options) => {
11-
const options = Object.assign({}, _options)
12-
const hasRouter = api.hasPlugin('router')
13-
const hasVuex = api.hasPlugin('vuex')
6+
const browserExtension = Object.assign({}, _options)
7+
delete browserExtension.registry
8+
delete browserExtension.components
9+
// const hasRouter = api.hasPlugin('router')
10+
// const hasVuex = api.hasPlugin('vuex')
1411
const hasTs = api.hasPlugin('typescript')
1512
const hasLint = api.hasPlugin('eslint')
1613
const fileExt = hasTs ? 'ts' : 'js'
1714

18-
options.hasRouter = hasRouter
19-
options.hasVuex = hasVuex
20-
options.hasTs = hasTs
21-
options.hasLint = hasLint
22-
options.fileExt = fileExt
23-
options.componentOptions = {}
24-
if (options.components.background) {
25-
options.componentOptions.background = {
15+
browserExtension.componentOptions = {}
16+
if (browserExtension.components.background) {
17+
browserExtension.componentOptions.background = {
2618
entry: `src/background.${fileExt}`
2719
}
2820
}
29-
if (options.components.contentScripts) {
30-
options.componentOptions.contentScripts = {
21+
if (browserExtension.components.contentScripts) {
22+
browserExtension.componentOptions.contentScripts = {
3123
entries: {
3224
'content-script': [`src/content-scripts/content-script.${fileExt}`]
3325
}
3426
}
3527
}
3628

37-
const appRootPath = process.cwd()
38-
const { name, description } = require(path.join(appRootPath, 'package.json'))
39-
const eslintConfig = { env: { webextensions: true } }
4029
const pkg = {
4130
private: true,
4231
scripts: {
4332
serve: 'vue-cli-service build --mode development --watch'
4433
},
45-
dependencies: {},
4634
devDependencies: {},
4735
vue: {
4836
pages: {},
49-
pluginOptions: {
50-
browserExtension: options
51-
}
37+
pluginOptions: { browserExtension }
5238
}
5339
}
54-
55-
if (api.hasPlugin('eslint')) {
56-
pkg.eslintConfig = eslintConfig
40+
if (hasLint) {
41+
pkg.eslintConfig = { env: { webextensions: true } }
5742
}
58-
5943
if (hasTs) {
6044
pkg.devDependencies['@types/firefox-webext-browser'] = '^67.0.2'
6145
}
62-
6346
api.extendPackage(pkg)
64-
api.render('./template/base-app', { name, description, ...options })
65-
api.render({ './src/components/HelloWorld.vue': `./template/HelloWorld.${fileExt}.vue` }, { name, ...options })
47+
48+
const { name, description } = require(api.resolve('package.json'))
49+
const options = Object.assign({}, browserExtension)
50+
options.name = name
51+
options.description = description
52+
// options.hasRouter = hasRouter
53+
// options.hasVuex = hasVuex
54+
options.hasTs = hasTs
55+
options.hasLint = hasLint
56+
options.fileExt = fileExt
57+
58+
api.render('./template/base-app', options)
59+
api.render({ './src/components/HelloWorld.vue': `./template/HelloWorld.${fileExt}.vue` }, options)
6660

6761
if (options.components.background) {
6862
api.render(
6963
{
7064
[`./src/background.${fileExt}`]: `./template/background/src/background.js`
7165
},
72-
{ name, ...options }
66+
options
7367
)
7468
}
7569

@@ -78,89 +72,28 @@ module.exports = (api, _options) => {
7872
{
7973
[`./src/content-scripts/content-script.${fileExt}`]: `./template/content-scripts/src/content-scripts/content-script.js`
8074
},
81-
{ name, ...options }
75+
options
8276
)
8377
}
8478

8579
if (options.components.popup) {
86-
api.render(
87-
{
88-
'./src/popup/App.vue': `./template/popup/src/popup/App.${fileExt}.vue`,
89-
[`./src/popup/main.${fileExt}`]: `./template/popup/src/popup/main.js`
90-
},
91-
{ name, ...options }
92-
)
93-
94-
pkg.vue.pages['popup'] = {
95-
entry: `src/popup/main.${fileExt}`,
96-
template: 'public/browser-extension.html',
97-
title: 'Popup'
98-
}
80+
renderDomain({ title: 'Popup', ext: fileExt, options, api })
9981
}
10082

10183
if (options.components.options) {
102-
api.render(
103-
{
104-
'./src/options/App.vue': `./template/options/src/options/App.${fileExt}.vue`,
105-
[`./src/options/main.${fileExt}`]: `./template/options/src/options/main.js`
106-
},
107-
{ name, ...options }
108-
)
109-
110-
pkg.vue.pages['options'] = {
111-
entry: `src/options/main.${fileExt}`,
112-
template: 'public/browser-extension.html',
113-
title: 'Options'
114-
}
84+
renderDomain({ title: 'Options', ext: fileExt, options, api })
11585
}
11686

11787
if (options.components.override) {
118-
api.render(
119-
{
120-
'./src/override/App.vue': `./template/override/src/override/App.${fileExt}.vue`,
121-
[`./src/override/main.${fileExt}`]: `./template/override/src/override/main.js`
122-
},
123-
{ name, ...options }
124-
)
125-
126-
pkg.vue.pages['override'] = {
127-
entry: `src/override/main.${fileExt}`,
128-
template: 'public/browser-extension.html',
129-
title: 'Override'
130-
}
88+
renderDomain({ title: 'Override', ext: fileExt, options, api })
13189
}
13290

13391
if (options.components.standalone) {
134-
api.render(
135-
{
136-
'./src/standalone/App.vue': `./template/standalone/src/standalone/App.${fileExt}.vue`,
137-
[`./src/standalone/main.${fileExt}`]: `./template/standalone/src/standalone/main.js`
138-
},
139-
{ name, ...options }
140-
)
141-
142-
pkg.vue.pages['standalone'] = {
143-
entry: `src/standalone/main.${fileExt}`,
144-
template: 'public/browser-extension.html',
145-
filename: 'index.html',
146-
title: name
147-
}
92+
renderDomain({ title: 'Standalone', filename: 'index.html', ext: fileExt, options, api })
14893
}
14994

15095
if (options.components.devtools) {
151-
api.render(
152-
{
153-
'./src/devtools/App.vue': `./template/devtools/src/devtools/App.${fileExt}.vue`,
154-
[`./src/devtools/main.${fileExt}`]: `./template/devtools/src/devtools/main.js`
155-
},
156-
{ name, ...options }
157-
)
158-
159-
pkg.vue.pages['devtools'] = {
160-
entry: `src/devtools/main.${fileExt}`,
161-
template: 'public/browser-extension.html',
162-
title: 'Devtools'
163-
}
96+
renderDomain({ title: 'Devtools', ext: fileExt, options, api })
16497
}
16598

16699
if (options.generateSigningKey === true) {
@@ -170,25 +103,10 @@ module.exports = (api, _options) => {
170103
}
171104

172105
api.onCreateComplete(() => {
173-
const gitignoreFile = api.resolve('./.gitignore')
174-
const gitignore = fs.readFileSync(gitignoreFile, 'utf8')
175-
176-
const gitignoreSnippet = gitignoreRules
177-
.filter((rule) => !new RegExp(`^${regexEscape(rule)}$`, 'gm').test(gitignore))
178-
.join('\n')
179-
if (gitignoreSnippet !== '' && gitignoreSnippet !== gitignoreRules[0]) {
180-
fs.writeFileSync(gitignoreFile, gitignore + '\n' + gitignoreSnippet + '\n')
181-
}
106+
renderGitignore(api)
182107

183108
if (hasTs) {
184-
const tsconfigFile = api.resolve('./tsconfig.json')
185-
const tsconfig = require(tsconfigFile)
186-
187-
if (!tsconfig.compilerOptions.types.includes('firefox-webext-browser')) {
188-
tsconfig.compilerOptions.types.push('firefox-webext-browser')
189-
}
190-
191-
fs.writeFileSync(tsconfigFile, JSON.stringify(tsconfig, null, 2))
109+
renderTs(api)
192110
}
193111
})
194112
}

‎index.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,19 +32,19 @@ module.exports = (api, options) => {
3232
? Object.assign(defaultOptions, options.pluginOptions.browserExtension)
3333
: defaultOptions
3434
const componentOptions = pluginOptions.componentOptions
35-
const packageJson = require(path.join(appRootPath, 'package.json'))
35+
const packageJson = api.resolve('package.json')
3636
const isProduction = api.service.mode === 'production'
3737
const keyFile = api.resolve('key.pem')
3838
const hasKeyFile = keyExists(keyFile)
3939
const contentScriptEntries = Object.keys((componentOptions.contentScripts || {}).entries || {})
4040

4141
const entry = {}
4242
const entries = {}
43-
if (pluginOptions.components.background) {
43+
if (componentOptions.background) {
4444
entries.background = 'background'
4545
entry.background = [api.resolve(componentOptions.background.entry)]
4646
}
47-
if (pluginOptions.components.contentScripts) {
47+
if (componentOptions.contentScripts) {
4848
entries.contentScript = contentScriptEntries
4949
for (const name of contentScriptEntries) {
5050
let paths = componentOptions.contentScripts.entries[name]

‎lib/render.js‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
const fs = require('fs')
2+
const gitignoreRules = ['# Vue Browser Extension Output', '*.pem', '*.pub', '*.zip', '/artifacts']
3+
const regexEscape = (rule) => rule.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
4+
5+
exports.renderTs = (api) => {
6+
const tsconfigFile = api.resolve('./tsconfig.json')
7+
const tsconfig = require(tsconfigFile)
8+
9+
if (!tsconfig.compilerOptions.types.includes('firefox-webext-browser')) {
10+
tsconfig.compilerOptions.types.push('firefox-webext-browser')
11+
}
12+
13+
fs.writeFileSync(tsconfigFile, JSON.stringify(tsconfig, null, 2))
14+
}
15+
16+
exports.renderGitignore = (api) => {
17+
const gitignoreFile = api.resolve('./.gitignore')
18+
const gitignore = fs.readFileSync(gitignoreFile, 'utf8')
19+
20+
const gitignoreSnippet = gitignoreRules
21+
.filter((rule) => !new RegExp(`^${regexEscape(rule)}$`, 'gm').test(gitignore))
22+
.join('\n')
23+
if (gitignoreSnippet !== '' && gitignoreSnippet !== gitignoreRules[0]) {
24+
fs.writeFileSync(gitignoreFile, gitignore + '\n' + gitignoreSnippet + '\n')
25+
}
26+
}
27+
28+
exports.renderDomain = ({ api, title, ext, filename, options }) => {
29+
const domain = title.toLowerCase()
30+
const entry = `./src/${domain}/main.${ext}`
31+
const template = 'public/browser-extension.html'
32+
33+
api.render(
34+
{
35+
[`./src/${domain}/App.vue`]: `../generator/template/${domain}/src/${domain}/App.${ext}.vue`,
36+
[entry]: `../generator/template/${domain}/src/${domain}/main.js`
37+
},
38+
options
39+
)
40+
41+
const page = { template, entry, title }
42+
if (filename !== undefined) {
43+
page.filename = filename
44+
}
45+
46+
api.extendPackage({ vue: { pages: { [domain]: page } } })
47+
}

0 commit comments

Comments
 (0)