From 15758d02cece7d50727949c42b5c5e8b0e011989 Mon Sep 17 00:00:00 2001 From: Basix Date: Wed, 22 Jan 2020 00:03:10 +0900 Subject: [PATCH] Use WebextensionPlugin instead of wext-manifest This commit changes webpack context. --- package.json | 3 +- src/manifest.json | 50 +++++++++++++++++++++++++++++++ src/manifest/index.js | 68 ------------------------------------------- webpack.config.js | 30 +++++++++---------- yarn.lock | 58 +++++++++++++++++++++++++++++------- 5 files changed, 111 insertions(+), 98 deletions(-) create mode 100644 src/manifest.json delete mode 100644 src/manifest/index.js diff --git a/package.json b/package.json index cad26ef..151f6a5 100644 --- a/package.json +++ b/package.json @@ -54,13 +54,12 @@ "webpack-cli": "^3.3.10", "webpack-dev-server": "^3.10.1", "webpack-fix-style-only-entries": "^0.4.0", - "write-webpack-plugin": "^1.1.0", "zip-webpack-plugin": "^3.0.0" }, "dependencies": { "@babel/runtime": "^7.7.7", "terser-webpack-plugin": "^2.3.1", "webextension-polyfill": "^0.6.0", - "wext-manifest": "^2.1.0" + "webpack-webextension-plugin": "^0.2.0" } } diff --git a/src/manifest.json b/src/manifest.json new file mode 100644 index 0000000..4ccfb0c --- /dev/null +++ b/src/manifest.json @@ -0,0 +1,50 @@ +{ + "manifest_version": 2, + "name": "Sample WebExtension", + "icons": { + "16": "assets/icons/favicon-16.png", + "32": "assets/icons/favicon-32.png", + "48": "assets/icons/favicon-48.png", + "128": "assets/icons/favicon-128.png" + }, + "description": "Sample description", + "homepage_url": "https://github.com/abhijithvijayan/web-extension-starter", + "short_name": "Sample Name", + "permissions": ["activeTab", "storage", "http://*/*", "https://*/*"], + "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", + "__chrome|firefox__author": "abhijithvijayan", + "__opera__developer": { "name": "abhijithvijayan" }, + "__firefox__applications": { + "gecko": { "id": "{754FB1AD-CC3B-4856-B6A0-7786F8CA9D17}" } + }, + "__chrome__minimum_chrome_version": "49", + "__opera__minimum_opera_version": "36", + "browser_action": { + "default_popup": "popup.html", + "default_icon": { + "16": "assets/icons/favicon-16.png", + "32": "assets/icons/favicon-32.png", + "48": "assets/icons/favicon-48.png", + "128": "assets/icons/favicon-128.png" + }, + "default_title": "tiny title", + "__chrome|opera__chrome_style": false, + "__firefox__browser_style": false + }, + "__chrome|opera__options_page": "options.html", + "options_ui": { + "page": "options.html", + "open_in_tab": true, + "__chrome__chrome_style": false + }, + "background": { + "scripts": ["js/background.bundle.js"], + "__chrome|opera__persistent": false + }, + "content_scripts": [ + { + "matches": ["http://*/*", "https://*/*"], + "js": ["js/contentScript.bundle.js"] + } + ] +} diff --git a/src/manifest/index.js b/src/manifest/index.js deleted file mode 100644 index 9e0ae07..0000000 --- a/src/manifest/index.js +++ /dev/null @@ -1,68 +0,0 @@ -const pkg = require('../../package.json'); - -const manifestInput = { - manifest_version: 2, - name: 'Sample WebExtension', - version: pkg.version, - - icons: { - '16': 'assets/icons/favicon-16.png', - '32': 'assets/icons/favicon-32.png', - '48': 'assets/icons/favicon-48.png', - '128': 'assets/icons/favicon-128.png', - }, - - description: 'Sample description', - homepage_url: 'https://github.com/abhijithvijayan/web-extension-starter', - short_name: 'Sample Name', - - permissions: ['activeTab', 'storage', 'http://*/*', 'https://*/*'], - content_security_policy: "script-src 'self' 'unsafe-eval'; object-src 'self'", - - '__chrome|firefox__author': 'abhijithvijayan', - __opera__developer: { - name: 'abhijithvijayan', - }, - - __firefox__applications: { - gecko: { id: '{754FB1AD-CC3B-4856-B6A0-7786F8CA9D17}' }, - }, - - __chrome__minimum_chrome_version: '49', - __opera__minimum_opera_version: '36', - - browser_action: { - default_popup: 'popup.html', - default_icon: { - '16': 'assets/icons/favicon-16.png', - '32': 'assets/icons/favicon-32.png', - '48': 'assets/icons/favicon-48.png', - '128': 'assets/icons/favicon-128.png', - }, - default_title: 'tiny title', - '__chrome|opera__chrome_style': false, - __firefox__browser_style: false, - }, - - '__chrome|opera__options_page': 'options.html', - - options_ui: { - page: 'options.html', - open_in_tab: true, - __chrome__chrome_style: false, - }, - - background: { - scripts: ['js/background.bundle.js'], - '__chrome|opera__persistent': false, - }, - - content_scripts: [ - { - matches: ['http://*/*', 'https://*/*'], - js: ['js/contentScript.bundle.js'], - }, - ], -}; - -module.exports = manifestInput; diff --git a/webpack.config.js b/webpack.config.js index b62e534..3a28505 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -1,18 +1,14 @@ const path = require('path'); const webpack = require('webpack'); -const wextManifest = require('wext-manifest'); const ZipPlugin = require('zip-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); -const WriteWebpackPlugin = require('write-webpack-plugin'); const { CleanWebpackPlugin } = require('clean-webpack-plugin'); const FixStyleOnlyEntriesPlugin = require('webpack-fix-style-only-entries'); - -const manifestInput = require('./src/manifest'); +const WebextensionPlugin = require('webpack-webextension-plugin'); const targetBrowser = process.env.TARGET_BROWSER; -const manifest = wextManifest[targetBrowser](manifestInput); const getExtensionFileType = () => { if (targetBrowser === 'opera') { @@ -26,13 +22,13 @@ const getExtensionFileType = () => { module.exports = { mode: process.env.NODE_ENV === 'production' ? 'production' : 'development', - + context: path.resolve(__dirname, 'src'), entry: { - background: './src/scripts/background.js', - contentScript: './src/scripts/contentScript.js', - popup: './src/scripts/popup.js', - options: './src/scripts/options.js', - styles: ['./src/styles/popup.scss', './src/styles/options.scss'], + background: './scripts/background.js', + contentScript: './scripts/contentScript.js', + popup: './scripts/popup.js', + options: './scripts/options.js', + styles: ['./styles/popup.scss', './styles/options.scss'], }, output: { @@ -53,26 +49,26 @@ module.exports = { verbose: true, }), new HtmlWebpackPlugin({ - template: 'src/options.html', + template: 'options.html', // inject: false, chunks: ['options'], filename: 'options.html', }), new HtmlWebpackPlugin({ - template: 'src/popup.html', + template: 'popup.html', // inject: false, chunks: ['popup'], filename: 'popup.html', }), - new CopyWebpackPlugin([{ from: 'src/assets', to: 'assets' }]), - new WriteWebpackPlugin([{ name: manifest.name, data: Buffer.from(manifest.content) }]), + new CopyWebpackPlugin([{ from: 'assets', to: 'assets' }]), + new WebextensionPlugin({ vendor: targetBrowser }), ], module: { rules: [ { test: /.(js|jsx)$/, - include: [path.resolve(__dirname, 'src/scripts')], + include: [path.resolve(__dirname, 'scripts')], loader: 'babel-loader', options: { @@ -95,7 +91,7 @@ module.exports = { loader: 'file-loader', options: { name: '[name].css', - context: './src/styles/', + context: './styles/', outputPath: 'css/', }, }, diff --git a/yarn.lock b/yarn.lock index 5138984..e37567d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -675,6 +675,38 @@ lodash "^4.17.13" to-fast-properties "^2.0.0" +"@hapi/address@2.x.x": + version "2.1.4" + resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5" + integrity sha512-QD1PhQk+s31P1ixsX0H0Suoupp3VMXzIVMSwobR3F3MSUO2YCV0B7xqLcUw/Bh8yuvd3LhpyqLQWTNcRmp6IdQ== + +"@hapi/bourne@1.x.x": + version "1.3.2" + resolved "https://registry.yarnpkg.com/@hapi/bourne/-/bourne-1.3.2.tgz#0a7095adea067243ce3283e1b56b8a8f453b242a" + integrity sha512-1dVNHT76Uu5N3eJNTYcvxee+jzX4Z9lfciqRRHCU27ihbUcYi+iSc2iml5Ke1LXe1SyJCLA0+14Jh4tXJgOppA== + +"@hapi/hoek@8.x.x", "@hapi/hoek@^8.3.0": + version "8.5.0" + resolved "https://registry.yarnpkg.com/@hapi/hoek/-/hoek-8.5.0.tgz#2f9ce301c8898e1c3248b0a8564696b24d1a9a5a" + integrity sha512-7XYT10CZfPsH7j9F1Jmg1+d0ezOux2oM2GfArAzLwWe4mE2Dr3hVjsAL6+TFY49RRJlCdJDMw3nJsLFroTc8Kw== + +"@hapi/joi@^15.0.1": + version "15.1.1" + resolved "https://registry.yarnpkg.com/@hapi/joi/-/joi-15.1.1.tgz#c675b8a71296f02833f8d6d243b34c57b8ce19d7" + integrity sha512-entf8ZMOK8sc+8YfeOlM8pCfg3b5+WZIKBfUaaJT8UsjAAPjartzxIYm3TIbjvA4u+u++KbcXD38k682nVHDAQ== + dependencies: + "@hapi/address" "2.x.x" + "@hapi/bourne" "1.x.x" + "@hapi/hoek" "8.x.x" + "@hapi/topo" "3.x.x" + +"@hapi/topo@3.x.x": + version "3.1.6" + resolved "https://registry.yarnpkg.com/@hapi/topo/-/topo-3.1.6.tgz#68d935fa3eae7fdd5ab0d7f953f3205d8b2bfc29" + integrity sha512-tAag0jEcjwH+P2quUfipd7liWCNX2F8NvYjQp2wtInsZxnMlypdw0FtAOLxtvvkO+GSRRbmNi8m/5y42PQJYCQ== + dependencies: + "@hapi/hoek" "^8.3.0" + "@types/anymatch@*": version "1.3.1" resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a" @@ -1663,7 +1695,7 @@ caseless@~0.12.0: resolved "https://registry.yarnpkg.com/caseless/-/caseless-0.12.0.tgz#1b681c21ff84033c826543090689420d187151dc" integrity sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw= -chalk@2.4.2, chalk@^2.0.0, chalk@^2.1.0, chalk@^2.4.2: +chalk@2.4.2, chalk@^2.0.0, chalk@^2.1.0, chalk@^2.4.1, chalk@^2.4.2: version "2.4.2" resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424" integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ== @@ -7222,6 +7254,15 @@ webpack-sources@^1.1.0, webpack-sources@^1.4.0, webpack-sources@^1.4.1, webpack- source-list-map "^2.0.0" source-map "~0.6.1" +webpack-webextension-plugin@^0.2.0: + version "0.2.0" + resolved "https://registry.yarnpkg.com/webpack-webextension-plugin/-/webpack-webextension-plugin-0.2.0.tgz#5d3d3af65529dd8aaab7e8358cbbe4801d8268a0" + integrity sha512-ojBx4bfpxQX3aGrt0vaTGsQ26ZGWze5hW+IaUyzliMeFOfiC9uLQgVYr5MbmHQajZLAz4TMI7kEoXsY2UXRWvw== + dependencies: + "@hapi/joi" "^15.0.1" + chalk "^2.4.1" + ws "^7.0.0" + webpack@^4.41.5: version "4.41.5" resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.41.5.tgz#3210f1886bce5310e62bb97204d18c263341b77c" @@ -7265,11 +7306,6 @@ websocket-extensions@>=0.1.1: resolved "https://registry.yarnpkg.com/websocket-extensions/-/websocket-extensions-0.1.3.tgz#5d2ff22977003ec687a4b87073dfbbac146ccf29" integrity sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg== -wext-manifest@^2.1.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/wext-manifest/-/wext-manifest-2.1.0.tgz#9ae4eefd6ffea93aa19917c6fe534830a76218bf" - integrity sha512-EV7fLAPSA1uHx/nQ9jmu2PAOgRgTi0rCvr6KycAl6fMJ4tvlLTP5dBAE0mmDWmVMH3z3jrtjrqsg0TU0Whg7rw== - which-module@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f" @@ -7335,11 +7371,6 @@ wrappy@1: resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f" integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8= -write-webpack-plugin@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/write-webpack-plugin/-/write-webpack-plugin-1.1.0.tgz#ac60a7fcbc149a8cc33a465420fbdf2f612e9af9" - integrity sha512-/E04VeJtHiOW02ET68yy38KRSOJTtvMFvAV3pLLgtYJWuhhNRQypPQWUsYzChndkRtedspqydOCG134AZZqBaA== - write@1.0.3: version "1.0.3" resolved "https://registry.yarnpkg.com/write/-/write-1.0.3.tgz#0800e14523b923a387e415123c865616aae0f5c3" @@ -7354,6 +7385,11 @@ ws@^6.2.1: dependencies: async-limiter "~1.0.0" +ws@^7.0.0: + version "7.2.1" + resolved "https://registry.yarnpkg.com/ws/-/ws-7.2.1.tgz#03ed52423cd744084b2cf42ed197c8b65a936b8e" + integrity sha512-sucePNSafamSKoOqoNfBd8V0StlkzJKL2ZAhGQinCfNQ+oacw+Pk7lcdAElecBF2VkLNZRiIb5Oi1Q5lVUVt2A== + xtend@^4.0.0, xtend@~4.0.1: version "4.0.2" resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"