{"id":15046159,"url":"https://github.com/aksimo/webpack-environment-suffix-plugin","last_synced_at":"2025-10-26T05:30:41.605Z","repository":{"id":77641982,"uuid":"110606879","full_name":"AksimO/webpack-environment-suffix-plugin","owner":"AksimO","description":"Webpack plugin to setup environment dependent builds.","archived":false,"fork":false,"pushed_at":"2017-12-06T12:24:26.000Z","size":16,"stargazers_count":9,"open_issues_count":1,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-11T01:02:17.821Z","etag":null,"topics":["ionic","webpack-plugin","webpack-resolver-plugin","wepback"],"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/AksimO.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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,"publiccode":null,"codemeta":null}},"created_at":"2017-11-13T21:54:25.000Z","updated_at":"2023-04-28T10:27:09.000Z","dependencies_parsed_at":"2023-03-09T21:00:47.393Z","dependency_job_id":null,"html_url":"https://github.com/AksimO/webpack-environment-suffix-plugin","commit_stats":{"total_commits":17,"total_committers":1,"mean_commits":17.0,"dds":0.0,"last_synced_commit":"aa1ae176866d5ea31c44c4bcb7760f1fd1996462"},"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AksimO%2Fwebpack-environment-suffix-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AksimO%2Fwebpack-environment-suffix-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AksimO%2Fwebpack-environment-suffix-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AksimO%2Fwebpack-environment-suffix-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AksimO","download_url":"https://codeload.github.com/AksimO/webpack-environment-suffix-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238264673,"owners_count":19443388,"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":["ionic","webpack-plugin","webpack-resolver-plugin","wepback"],"created_at":"2024-09-24T20:52:47.321Z","updated_at":"2025-10-26T05:30:41.305Z","avatar_url":"https://github.com/AksimO.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"## webpack-environment-suffix-plugin\n\n- [overview](#overview)\n- [installation](#installation)\n- [webpack configuration](#configure-webpack)\n- [options](#options)\n- [ionic](#ionic--380)\n    - [\u003e=3.8.0](#ionic--380)\n    - [\u003c 3.8.0](#ionic--380-1)\n\n### Overview\nPlugin allows to use different versions of config files for the different environments. You can create several versions of same file:\n```\nconfig.js\nconfig.dev.js\nconfig.prod.js\nconfig.qa.js\n```\nand plugin `webpack-environment-suffix-plugin` helps  resolve it properly. Idea is similar to what [angular cli](https://github.com/angular/angular-cli/wiki/build) `ng build --prod` does.\n\n### Install\n```sh\nnpm install webpack-environment-suffix-plugin --save\n```\n\n### Configure webpack\n- Find your `webpack.config.js` file.\n- Import `webpack-environment-suffix-plugin`\n```js\nconst EnvironmentSuffixPlugin = require('webpack-environment-suffix-plugin');\n```\n- Add instance of plugin to a [list of plugins](https://webpack.js.org/concepts/plugins/#usage).\n```js\n├── webpack.config.js\n\nconst EnvironmentSuffixPlugin = require('webpack-environment-suffix-plugin');\n\n//...\nconst config = {\n//...\n    plugins: [\n    //...\n    new EnvironmentSuffixPlugin({\n        suffix: process.env.NODE_ENV || 'dev'\n    })\n    ]\n//...\n}\n```\n- Update `package.json`.\n```json\n├── package.json\n\n//...\n\"scripts\": {\n//...\n\"build\": \"\u003cyou build script\u003e\",\n\"build:prod\": \"NODE_ENV=\\\"prod\\\" npm run build\",\n\"build:dev\": \"NODE_ENV=\\\"dev\\\" npm run build\",\n\"build:test\": \"NODE_ENV=\\\"qa\\\" npm run build\n//...\n}\n```\n\n## Options\n- `suffix` -- defines file suffix that should to be used by resolver. For instance `\"dev\"`, `\"prod\"`, `\"qa\"` or ony other you want to use. (*Default*: `\"dev\"`).\n- `ext` -- file extension. (*Default*: `\"js\"`; For typescript need to set to `\"ts\"`).\n- `include` -- Tests files against array of regexps. By default value is `[/.*\\.\u003cyour ext\u003e$/]`. \n*Note:* To improve plugin performance set `include` values as precise as possible.\nFor example:\n```js \nnew EnvironmentSuffixPlugin ({ \n  \"include\":[/src\\/config\\/*.js/, /src\\/environment\\/*.js/]\n})\n``` \n- `exclude` -- Array of patterns to exclude. (*Default:* `[/node_modules/]`).\n- `pattern` -- Pattern that is resolver is looking for. (*Default* `[name].[suffix]`). \nExample: \n```js\n  //Add resolve js files with suffix defined in process.env.NODE_ENV\n  new EnvironmentSuffixPlugin(\n    suffix: process.env.NODE_ENV\n  )\n\n  //add resolve for typescript for with custom pattern\n  new EnvironmentSuffixPlugin(\n    ext: 'ts'\n    suffix: process.env.NODE_ENV,\n    include:[/src\\/config/, /src\\/environment/],\n    // search fo custom pattern like: environment-dev.ts\n    pattern: '[name]-[suffix]'\n  )\n```\n\n\n## Ionic \u003e= 3.8.0\nThis package might be configured to be used with `ionic`.\n\n- Create new `webpack.config.js` file\n```js\n├── webpack.config.js\n\nconst webpackConfig = require('@ionic/app-scripts/config/webpack.config');\nconst EnvironmentSuffixPlugin = require('webpack-environment-suffix-plugin');\n\nconst ionicEnv = ['prod', 'dev'];\n\nconst addPluginToWebpackConfig = (config, env) =\u003e {\n  const plugins = config[env].plugins || [];\n\n  config[env].plugins = [\n    ...plugins,\n    new EnvironmentSuffixPlugin({\n      ext: 'ts',\n      suffix: process.env.NODE_ENV || 'dev'\n    })\n  ];\n\n  return config;\n};\n\nmodule.exports = () =\u003e {\n  return ionicEnv.reduce(addPluginToWebpackConfig, webpackConfig);\n};\n\n```\n\n- Add `\"ionic_webpack\": \u003cnew webpack.config.js path\u003e\"` to a `config` section of your `package.json`.\n```json\n├── package.json\n\n\"config\": {\n    \"ionic_webpack\": \"./webpack.config.js\" \n}\n```\n\n### Ionic \u003c 3.8.0\nEarlier versions of `ionic` have different structure of `@ionic/app-scripts/config/webpack.config`.\n\n```js\n├── webpack.config.js\n\nconst originalWebpackConfig = require('@ionic/app-scripts/config/webpack.config');\nconst EnvironmentSuffixPlugin = require('webpack-environment-suffix-plugin');\n\n\nmodule.exports = () =\u003e {\n    const plugins = originalWebpackConfig.plugins || [];\n\n    originalWebpackConfig.plugins = [\n      ...plugins,\n      new EnvironmentSuffixPlugin({\n        ext: 'ts',\n        suffix: process.env.NODE_ENV || 'dev'\n      })\n    ];\n\n    return originalWebpackConfig;\n}\n```\n\n### Need to mention\n[blueharvest](http://blueharvest.io)\n\n### License\n[MIT](http://opensource.org/licenses/MIT)\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faksimo%2Fwebpack-environment-suffix-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faksimo%2Fwebpack-environment-suffix-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faksimo%2Fwebpack-environment-suffix-plugin/lists"}