{"id":18822829,"url":"https://github.com/a2nt/silverstripe-webpack","last_synced_at":"2025-10-27T00:12:02.526Z","repository":{"id":47131871,"uuid":"120293651","full_name":"a2nt/silverstripe-webpack","owner":"a2nt","description":"SilverStripe WebPack boilerplate + Basics of JS/CSS UI","archived":false,"fork":false,"pushed_at":"2024-04-22T12:43:36.000Z","size":51241,"stargazers_count":8,"open_issues_count":0,"forks_count":2,"subscribers_count":5,"default_branch":"master","last_synced_at":"2024-04-22T12:48:52.574Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"Scheme","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/a2nt.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2018-02-05T11:06:23.000Z","updated_at":"2024-04-23T19:33:14.916Z","dependencies_parsed_at":"2023-10-14T14:05:42.569Z","dependency_job_id":"15432b8d-0cae-4950-b472-419ab7d0a283","html_url":"https://github.com/a2nt/silverstripe-webpack","commit_stats":{"total_commits":307,"total_committers":4,"mean_commits":76.75,"dds":0.2671009771986971,"last_synced_commit":"4c3fb3cf73cffa2fea4b11946f854c2f9c17be8b"},"previous_names":[],"tags_count":3,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/a2nt%2Fsilverstripe-webpack","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/a2nt%2Fsilverstripe-webpack/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/a2nt%2Fsilverstripe-webpack/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/a2nt%2Fsilverstripe-webpack/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/a2nt","download_url":"https://codeload.github.com/a2nt/silverstripe-webpack/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239758889,"owners_count":19692041,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":[],"created_at":"2024-11-08T00:51:49.083Z","updated_at":"2025-10-27T00:12:02.470Z","avatar_url":"https://github.com/a2nt.png","language":"Scheme","funding_links":[],"categories":[],"sub_categories":[],"readme":"## Simple WebPack boiler plate for SilverStripe\n\n[![Silverstripe Version](https://img.shields.io/badge/Silverstripe-5.1-005ae1.svg?labelColor=white\u0026logoColor=ffffff\u0026logo=data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDEuMDkxIDU4LjU1NSIgZmlsbD0iIzAwNWFlMSIgeG1sbnM6dj0iaHR0cHM6Ly92ZWN0YS5pby9uYW5vIj48cGF0aCBkPSJNNTAuMDE1IDUuODU4bC0yMS4yODMgMTQuOWE2LjUgNi41IDAgMCAwIDcuNDQ4IDEwLjY1NGwyMS4yODMtMTQuOWM4LjgxMy02LjE3IDIwLjk2LTQuMDI4IDI3LjEzIDQuNzg2czQuMDI4IDIwLjk2LTQuNzg1IDI3LjEzbC02LjY5MSA0LjY3NmM1LjU0MiA5LjQxOCAxOC4wNzggNS40NTUgMjMuNzczLTQuNjU0QTMyLjQ3IDMyLjQ3IDAgMCAwIDUwLjAxNSA1Ljg2MnptMS4wNTggNDYuODI3bDIxLjI4NC0xNC45YTYuNSA2LjUgMCAxIDAtNy40NDktMTAuNjUzTDQzLjYyMyA0Mi4wMjhjLTguODEzIDYuMTctMjAuOTU5IDQuMDI5LTI3LjEyOS00Ljc4NHMtNC4wMjktMjAuOTU5IDQuNzg0LTI3LjEyOWw2LjY5MS00LjY3NkMyMi40My0zLjk3NiA5Ljg5NC0uMDEzIDQuMTk4IDEwLjA5NmEzMi40NyAzMi40NyAwIDAgMCA0Ni44NzUgNDIuNTkyeiIvPjwvc3ZnPg==)](https://packagist.org/packages/goldfinch/google-maps)\n\nCheckout files at /app/ folder for details\nTake a look to https://github.com/a2nt/webpack-bootstrap-ui-kit.git for UI Kit details\n\nNote: I prefer using vanilla JS with minimal external dependencies to reach higher loading speed.\nThere's no jQuery and no React, but it can be connected optionally.\n\n# UI Demo\n\nUse UI Repository at https://github.com/a2nt/webpack-bootstrap-ui-kit.git to build static HTML files\n\nDemo: https://rawcdn.githack.com/a2nt/webpack-bootstrap-ui-kit/master/dist/index.html\n\n### Requirements:\n\n-   composer\n-   node\n-   yarn\n-   pnpm package manager\n\nhttps://pnpm.js.org/en/installation\n\nNote: You can use npm package manager, but this one will save your disc space. Replace pnpm commands with npm if you prefer npm\n\n### Installation:\n\n```\ngit clone https://github.com/a2nt/silverstripe-webpack.git\ncd silverstripe-webpack\ncomposer install\npnpm install\ncp ./env-dist ./.env\n```\n\nThose steps depends on your environment:\n\n1. Edit .env file to define database access credentials and CMS default admin\n2. sudo chown www-data:www-data -R public/assets \u0026\u0026 mkdir silverstripe-cache \u0026\u0026 chown www-data:www-data -R silverstripe-cache (www-data is commonly used UNIX user name, but it may depend on your environment)\n3. Open your-dev-url.pro/dev/build?flush to build database\n\n-   edit .env, robots.txt, humans.txt, cache.appcache, manifest.json and package.json to setup your own project\n-   copy favicon.ico after `yarn build` to ./public folder\n\n### Building your custom UI\n\nEdit following files:\n\n-   app/client/src/js/\\_layout.js\n-   app/client/src/js/types/_Your_Custom_ClassName_.js\n\n-   app/client/src/scss/\\_layout.scss\n-   app/client/src/scss/types/_Your_Custom_ClassName_.scss\n\nTo compile use: yarn build\nTo start dev-server use: yarn start\n\n## Installing composer at some cpanel hostings\n\n```\nphp -r \"copy('https://getcomposer.org/installer', 'composer-setup.php');\"\nphp -r \"if (hash_file('SHA384', 'composer-setup.php') === '544e09ee996cdf60ece3804abc52599c22b1f40f4323403c44d44fdfdd586475ca9813a858088ffbc1f233e9b180f061') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;\"\nphp composer-setup.php\nphp -r \"unlink('composer-setup.php');\"\n\nphp -d memory_limit=-1 composer.phar update --ignore-platform-reqs\n```\n\n### Features:\n\n-   You can use /app/\\_config/webpack.yml to setup webpack server parameters which will be used by webpack server and by SilverStripe to serve static content\n-   You can use WebpackJS('file-name') and WebpackCSS('file-name') functions at templates to require JS and CSS. It will be served using static files or by using Webpack if the website in development mode and Webpack server is running\n-   WebpackTemplateProvider::WebpackJS('file-name') and WebpackTemplateProvider::WebpackCSS('file-name') can be used at php area\n-   All images will be optimised at /app/client/src/img and will be written to /app/client/dist/img (by default)\n-   Favicons will be generated at /app/client/dist/icons using /app/src/favicon.png\n-   Folder /app/client/src/js/types is used to create page specific JS (just create JS file there and it will be compiled)\n-   Folder /app/clent/src/scss/types is used to create page specific CSS (just create SCSS file there and it will be compiled)\n-   Automatic linting (JS+SCSS)\n-   Bootstrap 5 included by default\n-   Font-Awesome included by default\n-   Deferred requirements loading\n-   Requirements auto-loading\n-   Includes basic silverstripe modules\n-   Some necessary extensions for example editing silverstripe elements as bootstrap grid columns\n-   Built-in themes support\n\n... More features available, but I don't have much time to describe all of them ...\n\n### Folder structure:\n\n-   /app/\\_config/webpack.yml (Webpack configurtion)\n-   /app/src/WebpackTemplateProvider.php (WebpackJS and WebpackCSS functionality)\n-   /app/src/DeferedRequirements.php (Deferred Requirements + Requirements auto-loader)\n-   /app/templates/Page.ss (An example of Page.ss)\n-   /app/src (Your backend sources)\n-   /app/client/src (Your frontend sources)\n-   /app/client/dist (Your compiled-production assets)\n\n*   /app/client/src/js (Your JS-scripts)\n*   /app/client/src/js/app.js (main application file to include website-wide components)\n*   /app/client/src/js/main.js (Your custom site-wide functionality)\n*   /app/client/src/js/\\_pageType_and_component_template.js (A template which can be used to create new modules)\n*   /app/client/src/types/*.js (Extra page-specific modules to be auto-compiled. My suggestion is to use *ClassName\\*.js and then require it at SilverStripe custom controller area)\n\n-   /app/clent/src/scss (Your styling to be compiled)\n-   /app/clent/src/scss/app.scss (main application file to include site-wide components)\n-   /app/clent/src/scss/\\_variables.sccs (your custom and bootstrap variables)\n-   /app/clent/src/scss/\\_layout.sccs (Your site-wide styling)\n\n-   /app/client/dist (Compiled frontend files js, css, images etc)\n\n### Commands:\n\n-   yarn - to update packages\n-   yarn start - to start webpack development webserver\n-   yarn build - to build production assets\n-   yarn lint:check - to check SCSS and JS linting\n-   yarn lint:fix - to fix SCSS and JS linting automatically\n\n### Usefull UNIX console utilities\n\n#### Code search  (find . -name \"*.*\" | xargs grep \"some text\" replacement)\n\nag \"some text\" ./\nhttps://github.com/ggreer/the_silver_searcher\n\n#### File content with code hightlighting (cat replacement)\n\nbat ./app/src/Pages/Page.php\nhttps://github.com/sharkdp/bat\n\n#### File listing (ls replacement)\n\nexa -aTL3 ./app\nhttps://github.com/ogham/exa\n\n### git diff tool with bat code hightlighting (git show)\n\nhttps://github.com/dandavison/delta\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fa2nt%2Fsilverstripe-webpack","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fa2nt%2Fsilverstripe-webpack","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fa2nt%2Fsilverstripe-webpack/lists"}