{"id":40819882,"url":"https://github.com/mjyocca/visualforce-template-webpack-plugin","last_synced_at":"2026-01-21T21:47:01.765Z","repository":{"id":44012526,"uuid":"234451634","full_name":"mjyocca/visualforce-template-webpack-plugin","owner":"mjyocca","description":"Webpack plugin that simplifies the updating of Visualforce template files to serve your webpack bundles","archived":false,"fork":false,"pushed_at":"2023-01-05T08:40:55.000Z","size":356,"stargazers_count":0,"open_issues_count":10,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-09-09T01:27:38.311Z","etag":null,"topics":["salesforce","salesforce-developers","sfdx","visualforce","webpack","webpack-plugin"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mjyocca.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-01-17T02:11:40.000Z","updated_at":"2020-07-14T16:05:51.000Z","dependencies_parsed_at":"2023-02-03T21:01:13.465Z","dependency_job_id":null,"html_url":"https://github.com/mjyocca/visualforce-template-webpack-plugin","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/mjyocca/visualforce-template-webpack-plugin","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjyocca%2Fvisualforce-template-webpack-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjyocca%2Fvisualforce-template-webpack-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjyocca%2Fvisualforce-template-webpack-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjyocca%2Fvisualforce-template-webpack-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mjyocca","download_url":"https://codeload.github.com/mjyocca/visualforce-template-webpack-plugin/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mjyocca%2Fvisualforce-template-webpack-plugin/sbom","scorecard":{"id":651863,"data":{"date":"2025-08-11","repo":{"name":"github.com/mjyocca/visualforce-template-webpack-plugin","commit":"c026d53ea8438f2fecbf0856a4286403c4123b64"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":1.7,"checks":[{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Code-Review","score":0,"reason":"Found 0/6 approved changesets -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE.txt:0","Info: FSF or OSI recognized license: MIT License: LICENSE.txt:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 11 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"26 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-968p-4wvh-cqc8","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-w8qv-6jwh-64r5","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-rp65-9cf3-cjxr","Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw","Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-21T13:42:48.912Z","repository_id":44012526,"created_at":"2025-08-21T13:42:48.912Z","updated_at":"2025-08-21T13:42:48.912Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28644149,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-21T21:29:11.980Z","status":"ssl_error","status_checked_at":"2026-01-21T21:24:31.872Z","response_time":86,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["salesforce","salesforce-developers","sfdx","visualforce","webpack","webpack-plugin"],"created_at":"2026-01-21T21:46:59.137Z","updated_at":"2026-01-21T21:47:01.749Z","avatar_url":"https://github.com/mjyocca.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Latest Stable Version](https://img.shields.io/npm/v/visualforce-template-webpack-plugin.svg)](https://www.npmjs.com/package/visualforce-template-webpack-plugin)\n[![NPM Downloads](https://img.shields.io/npm/dm/visualforce-template-webpack-plugin.svg)](https://www.npmjs.com/package/visualforce-template-webpack-plugin)\n[![License](https://img.shields.io/github/license/mjyocca/visualforce-template-webpack-plugin.svg)](https://github.com/mjyocca/visualforce-template-webpack-plugin)\n\n# Visualforce Template Webpack Plugin\n\nThis is a [Webpack](https://webpack.js.org/) plugin that simplifies the updating of your [Visualforce](https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_intro_what_is_it.htm) page(s)/component(s) by embedding your static resource file(s) as script and link tags. \n\n*More about referencing static resource files in Visualforce markup [here](https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_resources_reference.htm).*\n\n#### Before Webpack Compilation:\n**`App.page`**\n```html\n\u003capex:page\u003e\n\n    \u003c!--% styles %--\u003e\n    \u003c!--% styles %--\u003e\n\n    \u003capex:pageBlock\u003e\n    ...\n    \u003c/apex:pageBlock\u003e\n    ...\n    \u003c!--% scripts %--\u003e\n    \u003c!--% scripts %--\u003e\n\n\u003c/apex:page\u003e\n```\n\n#### After Webpack Compilation:\n**`App.page`**\n```html\n\u003capex:page\u003e\n\n    \u003c!--% styles %--\u003e\n    \u003clink type=\"text/css\" rel=\"stylesheet\" href=\"{!$Resource.dist, 'main.css')}\" /\u003e\n    \u003c!--% styles %--\u003e\n\n    \u003capex:pageBlock\u003e\n    ...\n    \u003c/apex:pageBlock\u003e\n    ...\n    \u003c!--% scripts %--\u003e\n    \u003cscript type=\"text/javascript\" src=\"{!$Resource.dist, 'bundle.js')}\"\u003e\u003c/script\u003e\n    \u003c!--% scripts %--\u003e\n\n\u003c/apex:page\u003e\n```\n\n\u003cbr /\u003e\n\n# Install\n```bash\nnpm i visualforce-template-webpack-plugin --save-dev\n```\n\n#### Read Before Moving On!\n\n* Do not put anything between  `\u003c!--% scripts %--\u003e\u003c!--% scripts %--\u003e` comment tags. They will be \u003cspan style=\"color:red;\"\u003eerased!!\u003c/span\u003e\n\n\u003cbr /\u003e\n\n# Configuration\n\n\u003ch3 align=\"\"\u003eStep 1: Visualforce Template Declaration\u003c/h3\u003e\n\n#### In your Visualforce Page, you need to declare where you want the assets to generate.\u003cbr/\u003e\n`% scripts %` for your js files and `% styles %` for your css files\n\u003cbr/\u003e\n\n#### Spacing does not matter\n`\u003c!--%scripts%--\u003e`, `\u003c!--% scripts %--\u003e`, or `\u003c!-- % scripts % --\u003e`\n\n**App.page**\n```html\n\u003capex:page\u003e\n    \u003chead\u003e\n        \u003c!--% styles %--\u003e\n        \u003c!-- WARNING: Do NOT Put anything [HERE]. Will get erased --\u003e\n        \u003c!--% styles %--\u003e\n    \u003c/head\u003e\n    \u003cbody\u003e\n        \u003capex:form\u003e\n            ...\n        \u003c/apex:form\u003e\n        \u003cscript\u003e\n            //put non webpack/global javascript here\n        \u003c/script\u003e\n        \u003c!--% scripts %--\u003e\n        \u003c!-- WARNING: Do NOT Put anything [HERE]. Will get erased --\u003e\n        \u003c!--% scripts %--\u003e\n    \u003c/body\u003e\n\u003c/apex:page\u003e\n```\n\n\u003ch3\u003eStep 2: Import/Require Plugin into Webpack config file\u003c/h3\u003e\n\n**webpack.config.js**\n```js\nconst VisualforcePlugin = require('visualforce-template-webpack-plugin')\n```\n\n\n\u003ch3\u003eStep 3: Add a new  instance of the Imported/Required Plugin configuration \u003c/h3\u003e\n\n**webpack.config.js**\n\n```js\n//From Step 1\nconst VisualforcePlugin = require('visualforce-template-webpack-plugin')\n\nmodule.exports = {\n    entry: './index.js',\n    output: {\n        filname: '[name].bundle.js',\n        path: \"./force-app/main/default/staticresources/dist\"\n    },\n    plugins: [\n        // Add a new instance here\n        new VisualforcePlugin({\n            page: './force-app/default/main/pages/App.page'\n        })\n    ]\n}\n```\n\n\u003cbr /\u003e\n\n\u003ch1 align=\"\"\u003eOptions\u003c/h1\u003e\n\n#### Plugin accepts `{Object}` or `{Array}` of objects w/ the following data structure\n\n|Name|Type|Default|Required|Description|\n|:--:|:--:|:-----:|:--:|:----------|\n|**`entry`**|`{String} or {Array} of strings`|`main`|`false`|Name of entry configuration key name. Needs to match your webpack config entry names. Defaults to all entrypoint assets if none specified.|\n|**`page`**|`{String}`|`undefined`|`true`|Relative path to your visualforce page or component file|\n|**`scriptHook`**|`{Function}`|`undefined`|false|Callback function to modify `src` and other attributes on script tag|\n|**`styleHook`**|`{Function}`|`undefined`|false|Function to hook into modifying attributes of link tags|\n\n\u003chr /\u003e\n\u003ch3 align=\"center\" style=\"\"\u003eentry\u003c/h3\u003e\n\n*You can filter out entrypoint assets you wish to not include in the page*. \n\nExample: **webpack.config.js**\n```js\nmodules.exports = {\n    entry: {\n        app: './app.js',\n        main: './main.js',\n        mobile: './mobile.js'\n    },\n    output: {\n        filename: '[name].bundle.js',\n        path: path.resolve(__dirname, \"force-app/main/default/staticresources/dist\"),\n    },\n    plugins: [\n        new VisualforceTemplate({\n            entry: ['app', 'main'],  // mobile entry is not included\n            page: path.resolve(__dirname, 'force-app/main/default/pages/App.page')\n        })\n    ]\n}\n```\n\u003chr /\u003e\n\n\u003ch3 align=\"center\" style=\"\"\u003epage\u003c/h3\u003e\n *You can optionally update a Visualforce Component as well*\n\nExample: **webpack.config.js**\n```js\nmodules.exports = {\n    entry: './app.js',\n    output: {\n        filename: '[name].bundle.js',\n        path: path.resolve(__dirname, \"force-app/main/default/staticresources/dist\"),\n    },\n    plugins: [\n        new VisualforceTemplate({\n            page: path.resolve(__dirname, 'force-app/main/default/components/[Name].component')\n        })\n    ]\n}\n```\n\n**`[Name].component`**\n```html\n\u003capex:component\u003e\n    \u003c!--% scripts %--\u003e\n    \u003cscript type=\"text/javascript\" src=\"{!URLFOR($Resource.dist, 'main.bundle.js')}\"\u003e\u003c/script\u003e\n    \u003c!--% scripts %--\u003e\n\u003c/apex:component\u003e\n```\n\n\u003chr /\u003e\n\u003ch3 align=\"center\" style=\"\"\u003escriptHook\u003c/h3\u003e\n\n *Script Tag Attribute Defaults*\n\n|Name|Default|\n|:----:|:----:|\n|**`type`**|`text/javascript`|\n|**`src`**|`[Depends on output in static resource]`|\n|**`async`**|`false`|\n|**`defer`**|`false`|\n|**`nomodule`**|`false`|\n\n**How to overide defaults**:\nReturn an Object and setting any of the properties in the table above. Only need to include the script tag attributes you wish to change. The function is passed an object containing:\n\n\n\n```js\nscriptHook: (scriptData) =\u003e {\n    const { resourceName, resourceFilePath } = scriptData;\n    // ...\n    return { \n        src: `${resourceName}/${resourceFilePath}`\n    } \n}\n```\n\n#### examples of using the options \n```js\nnew VisualforcePlugin({\n        entry: 'app',\n        page: path.resolve(__dirname, \"./force-app/default/main/pages/App.page\"),\n        scriptHook: ({ resourceName, resourceFilePath }) =\u003e {\n            // ...\n            return {\n                src: `{!URLFOR($Resource.${resourceName}, '${resourceFilePath}')}`,\n                type: 'text/javascript'\n            }\n        }\n    })\n```\n\n\u003chr/\u003e\n\n\u003ch3 align=\"center\" style=\"\"\u003estyleHook\u003c/h3\u003e\n\n*Style Tag Attribute Defaults*\n\u003c!-- #### Style Tag Attribute Defaults --\u003e\n\n|Name|Default|\n|:----:|:----:|\n|**`rel`**|`stylesheet`|\n|**`href`**|`[Depends on output in static resource]`|\n|**`type`**|`text/css`|\n\n**How to overide defaults**:\nReturn an Object and setting any of the properties in the table above. Only need to include the script tag attributes you wish to change. The function is passed an object containing:\n\n```js\nnew VisualforcePlugin({\n        entry: 'app',\n        page: path.resolve(__dirname, \"./force-app/default/main/pages/App.page\"),\n        styleHook: ({ resourceName, resourceFilePath }) =\u003e {\n            return {\n                rel: 'stylesheet',\n                href: ``,\n                type: ''\n            };\n        }\n})\n```\n\u003cbr /\u003e\n\n\u003ch1\u003eExample(s)\u003c/h1\u003e\n\n[View More Examples Here](https://github.com/mjyocca/visualforce-template-webpack-plugin/tree/master/examples)\n\n**webpack.config.js**\n```js\nconst path = require('path')\nconst VisualforcePlugin = require('visualforce-template-webpack-plugin')\n\nmodule.exports = {\n    entry: {\n        app: './index.js'\n    },\n    output: {\n        filename: 'bundle.js'\n        path: path.resolve(__dirname, \"./force-app/main/default/staticresources/dist\")\n    },\n    plugins: [\n        new VisualforcePlugin({\n            entry: 'app',\n            page: './force-app/default/main/pages/App.page'\n        })\n    ]\n}\n```\n#### Before:\n**App.page**\n```html\n\u003capex:page\u003e\n    \u003capex:pageBlock\u003e\n    ...\n    \u003c/apex:pageBlock\u003e\n    ...\n    \u003c!--% scripts %--\u003e\n    \u003c!--% scripts %--\u003e\n\u003c/apex:page\u003e\n```\n\n#### After:\n**App.page**\n```html\n\u003capex:page\u003e\n    \u003capex:pageBlock\u003e\n    ...\n    \u003c/apex:pageBlock\u003e\n    ...\n    \u003c!--% scripts %--\u003e\n    \u003cscript type=\"text/javascript\" src=\"{!$Resource.dist, 'bundle.js')}\"\u003e\u003c/script\u003e\n    \u003c!--% scripts %--\u003e\n\u003c/apex:page\u003e\n```\n\n---\n## Updating Multiple Visualforce File(s)\n\nexample of updating more than one visualforce page/component w/ multiple entries\n\n***webpack.config.js***\n```js\nconst path = require('path')\nconst VisualforcePlugin = require('visualforce-template-webpack-plugin')\n\nmodule.exports = {\n    entry: {\n        app: './app.js',\n        admin: '/admin.js',\n        mobile: './admin.js'\n    },\n    output: {\n        filename: '[name].bundle.js',\n        path: path.resolve(__dirname, \"./force-app/main/default/staticresources/dist\")\n    },\n    plugins: [\n        new VisualforcePlugin([{   \n                entry: 'app',\n                page: path.resolve(__dirname, \"./force-app/main/default/pages/App.page\") \n            },\n            {\n                entry: 'admin',\n                page: path.resolve(__dirname, \"./force-app/main/default/pages/Admin.page\")\n            },\n            {\n                entry: 'mobile',\n                page: path.resolve(__dirname, \"./force-app/main/default/pages/AppSf1.page\")\n        }])\n    ]\n}\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmjyocca%2Fvisualforce-template-webpack-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmjyocca%2Fvisualforce-template-webpack-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmjyocca%2Fvisualforce-template-webpack-plugin/lists"}