{"id":16199145,"url":"https://github.com/sandromiguel/gulp-setup","last_synced_at":"2025-10-24T17:30:17.474Z","repository":{"id":43974612,"uuid":"248356204","full_name":"SandroMiguel/gulp-setup","owner":"SandroMiguel","description":null,"archived":true,"fork":false,"pushed_at":"2022-12-05T14:10:09.000Z","size":702,"stargazers_count":3,"open_issues_count":9,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-10-27T21:43:57.436Z","etag":null,"topics":["gulp","setup"],"latest_commit_sha":null,"homepage":null,"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/SandroMiguel.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-03-18T22:23:48.000Z","updated_at":"2024-05-02T17:01:23.000Z","dependencies_parsed_at":"2023-01-24T05:45:50.618Z","dependency_job_id":null,"html_url":"https://github.com/SandroMiguel/gulp-setup","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SandroMiguel%2Fgulp-setup","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SandroMiguel%2Fgulp-setup/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SandroMiguel%2Fgulp-setup/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SandroMiguel%2Fgulp-setup/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SandroMiguel","download_url":"https://codeload.github.com/SandroMiguel/gulp-setup/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238008519,"owners_count":19401267,"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":["gulp","setup"],"created_at":"2024-10-10T09:24:26.958Z","updated_at":"2025-10-24T17:30:17.076Z","avatar_url":"https://github.com/SandroMiguel.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Gulp 4 configuration file\n\n[Gulp](http://gulpjs.com/) is an open-source task runner to automate tasks.\n\nAll Gulp configuration goes in `gulpfile.js` where plugins are loaded and tasks are defined.\n\n## Goal\n\n-   Sass compilation\n    -   CSS minification\n    -   Rename files to `.min.css`\n    -   Copy minified CSS to public folder.\n-   Transpile ES6+ using [Babel](https://babeljs.io/)\n    -   JS minification\n        -   Rename files to `.min.js`\n        -   Generate JS source maps\n-   Cache bust\n-   Watch for changes in code\n\n## Installation\n\nNOTE: you need to have [Node](http://nodejs.org/) installed on your computer.\n\n### Step 1. Install the Gulp command line utility\n\n#### Install Gulp CLI with Yarn globally\n\n```sh\nyarn global add gulp-cli\n```\n\n#### Or install Gulp CLI with npm globally\n\n```sh\nnpm install -g gulp-cli\n```\n\n### Step 2. Install the Gulp package in your devDependencies\n\n#### Install Gulp with Yarn\n\n```sh\nyarn add gulp --dev\n```\n\n#### Or install Gulp with npm\n\n```sh\nnpm install --save-dev gulp\n```\n\n## Dev Dependencies\n\nThese are the dependencies/plugins that we will use\n\n-   [@babel/core](https://github.com/babel/babel/tree/master/packages/babel-core): Babel compiler core\n-   [@babel/preset-env](https://github.com/babel/babel/tree/master/packages/babel-preset-env): A Babel preset for each environment\n-   [autoprefixer](https://github.com/postcss/autoprefixer): PostCSS plugin to parse CSS and add vendor prefixes to CSS rules\n-   [cssnano](https://github.com/cssnano/cssnano): A modular minifier, built on top of the PostCSS ecosystem\n-   [gulp-babel](https://github.com/babel/gulp-babel): Gulp plugin for Babel\n-   [gulp-postcss](https://github.com/postcss/gulp-postcss): PostCSS Gulp plugin to pipe CSS through several plugins, but parse CSS only once.\n-   [gulp-rename](https://github.com/hparra/gulp-rename): Rename files easily\n-   [gulp-replace](https://github.com/lazd/gulp-replace): A string replace plugin for Gulp\n-   [gulp-sass](https://github.com/dlmanning/gulp-sass): SASS plugin for Gulp\n-   [gulp-sourcemaps](https://github.com/gulp-sourcemaps/gulp-sourcemaps): Source map support for Gulp\n-   [gulp-uglify](https://github.com/terinjokes/gulp-uglify): Minify files with UglifyJS\n\n### Step 3. Installing Gulp plugins\n\nInstall all necessary plugins\n\n#### With Yarn\n\n```sh\nyarn add @babel/core @babel/preset-env autoprefixer cssnano gulp-babel gulp-postcss gulp-rename gulp-replace gulp-sass gulp-sourcemaps gulp-uglify --dev\n```\n\n#### Or with npm\n\n```sh\nnpm install --save-dev @babel/core @babel/preset-env autoprefixer cssnano gulp-babel gulp-postcss gulp-rename gulp-replace gulp-sass gulp-sourcemaps gulp-uglify\n```\n\n## Running\n\n### Step 4. Copy the Gulp file\n\nCopy the [gulpfile.js](gulpfile.js) to the root of your project and run Gulp.\n\n### Step 5. Run the default task\n\nDevelopment environment\n\nRun `gulp` to deploy your app for distribution in the `public` folder.\n\n```sh\ngulp\n```\n\nThis will watches the following files:\n\n-   .scss\n-   .js\n\nWhen a file changes, it runs its associated task.\n\n### Single task\n\nTo run individual tasks.\n\n```sh\ngulp [task name]\n```\n\nExample:\n\n```sh\ngulp sass\n```\n\n## Task list\n\nAll available tasks\n\n-   `default`: Default task (can be omitted)\n-   `javascript`: It transpiles, adds sourcemaps and uglify your JS files\n-   `style`: It compiles scss into css file, adds sourcemaps and minify\n-   `watch`: It watches for files changes\n\n## Predefined file structure\n\n```\nyour-app/\n|—— src/\n|   |—— sass/\n|   |   |—— somefile.scss\n|   |   |—— [otherfile].scss\n|   |—— js/\n|   |   |—— somefile.js\n|   |   |—— [otherfile].js\n|   |—— img/\n|   |   |—— [original image files]\n|—— public/\n|   |—— css/\n|   |   |—— somefile.min.css\n|   |   |—— [otherfile].min.css\n|   |—— js/\n|   |   |—— somefile.min.js\n|   |   |—— [otherfile].min.js\n|   |—— img/\n|   |   |—— [optimized image files]\n|—— gulpfile.js\n|—— package.json\n```\n\n## Contributing\n\nWant to contribute? All contributions are welcome. Read the [contributing guide](CONTRIBUTING.md).\n\n## Questions\n\nIf you have questions tweet me at [@sandro_m_m](https://twitter.com/sandro_m_m) or [open an issue](../../issues/new).\n\n## License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details\n\n**~ sharing is caring ~**\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsandromiguel%2Fgulp-setup","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsandromiguel%2Fgulp-setup","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsandromiguel%2Fgulp-setup/lists"}