{"id":15927864,"url":"https://github.com/thescientist13/webpack-migrate-sandbox","last_synced_at":"2025-10-29T02:38:04.752Z","repository":{"id":80193564,"uuid":"98807663","full_name":"thescientist13/webpack-migrate-sandbox","owner":"thescientist13","description":null,"archived":false,"fork":false,"pushed_at":"2017-07-30T22:45:34.000Z","size":79,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-03T13:36:59.583Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/thescientist13.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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-07-30T15:44:27.000Z","updated_at":"2017-07-30T22:23:11.000Z","dependencies_parsed_at":null,"dependency_job_id":"f410b712-e29f-4dd3-bf00-1417dbf19942","html_url":"https://github.com/thescientist13/webpack-migrate-sandbox","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thescientist13%2Fwebpack-migrate-sandbox","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thescientist13%2Fwebpack-migrate-sandbox/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thescientist13%2Fwebpack-migrate-sandbox/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/thescientist13%2Fwebpack-migrate-sandbox/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/thescientist13","download_url":"https://codeload.github.com/thescientist13/webpack-migrate-sandbox/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":240215922,"owners_count":19766494,"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-10-06T23:20:37.133Z","updated_at":"2025-10-29T02:37:59.715Z","avatar_url":"https://github.com/thescientist13.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# webpack-migrate-poc\n\n## Overview\nThis repository is for testing and documenting **webpack-cli**'s [`migrate`](https://github.com/webpack/webpack-cli#migration-from-webpack-v1-to-v2) \ncommand and documenting the steps to resolve this [issue](https://github.com/webpack/webpack-cli/issues/166), which is to document the migration process for developers.\n\n## Objectives\nThe objectives of this repo will be a \"live\" aid to support the goal of documenting the migration process.  The steps will include:\n\n1.  A basic JavaScript \"Hello World\" example (to verify the before / after)\n1.  Using a single [webpack 1](http://webpack.github.io/docs/) based configration reflecting \"common\" usage patterns\n1.  Running the migration tast against that configuration\n1.  Documenting the results in [MIGRATE.md](https://github.com/webpack/webpack-cli/blob/master/MIGRATE.md) in a fork\n1.  Submitting a PR\n1.  ???\n1.  Profit\n\n## Testing\nValidation oppourtunites include\n1.  Making sure the basic sample application works\n1.  Observing what webpack-cli generates and using that as a basis for creating our configuration here\n\n### webpack-cli prompts\nRunning the **webpack-cli** and seeing the questions asked will provide the initial context for the configuration used in \nthis project.  So here in (IMO) would be a typical set of answers to running `webpack-cli init`, selecting all the defaults\nwhere possible.\n\n```bash\n? Will your application have multiple bundles? Yes\n? Type the name you want for your modules (entry files), separated by comma index\n? What is the location of 'index'? src/index\n? Which folder will your generated bundles be in? [default: dist]:\n? Are you going to use this in production? Yes\n? Will you be using ES2015? Yes\n? Will you use one of the below CSS solutions? SASS\n? If you want to bundle your CSS files, what will you name the bundle? (press enter to skip) styles\n? Name your 'webpack.[name].js?' [default: 'prod']:\n```\n\n### webpack-cli config\nThis is the generated config (minus comments)\n\n```javascript\n  const webpack = require('webpack');\n  const path = require('path');\n  const UglifyJSPlugin = require('uglifyjs-webpack-plugin');\n  const ExtractTextPlugin = require('extract-text-webpack-plugin');\n  \n  module.exports = {\n    entry: {\n      index: 'src/index.js'\n    },\n  \n    output: {\n      filename: '[name].[chunkhash].js',\n      chunkFilename: '[name].[chunkhash].js',\n      path: path.resolve(__dirname, 'dist')\n    },\n  \n    module: {\n      rules: [\n        {\n          test: /\\.js$/,\n          exclude: /node_modules/,\n          loader: 'babel-loader',\n  \n          options: {\n            presets: ['es2015']\n          }\n        },\n        {\n          test: /\\.(scss|css)$/,\n  \n          use: ExtractTextPlugin.extract({\n            use: [\n              {\n                loader: 'css-loader',\n                options: {\n                  sourceMap: true\n                }\n              },\n              {\n                loader: 'sass-loader',\n                options: {\n                  sourceMap: true\n                }\n              }\n            ],\n            fallback: 'style-loader'\n          })\n        }\n      ]\n    },\n  \n    plugins: [\n      new UglifyJSPlugin(),\n      new ExtractTextPlugin('styles.[contentHash].css'),\n      new webpack.optimize.CommonsChunkPlugin({\n        name: 'index',\n        filename: 'index-[hash].min.js'\n      })\n    ]\n  };\n```\n\n### Dependencies\nThis is the dependencies section of a _package.json_ file updated after running `webpack-cli init` \n\n```javascript\n  \"devDependencies\": {\n    \"babel-core\": \"^6.25.0\",\n    \"babel-loader\": \"^7.1.1\",\n    \"babel-preset-es2015\": \"^6.24.1\",\n    \"css-loader\": \"^0.28.4\",\n    \"extract-text-webpack-plugin\": \"^3.0.0\",\n    \"node-sass\": \"^4.5.3\",\n    \"sass-loader\": \"^6.0.6\",\n    \"style-loader\": \"^0.18.2\",\n    \"uglifyjs-webpack-plugin\": \"^0.4.6\",\n    \"webpack\": \"^3.4.1\"\n  }\n```\n\nIt will also be used as a starting point for configuring this project's dependencies, but modified slightly in instances \nwhere dependencies are backwards incompatible with webpack v1, like:\n\n- [Downgraded](https://github.com/babel/babel-loader#install) **babel-loader** to `^6.0.0`\n- Downgraded **extract-text-webpack-plugin** to `^1.0.0`\n\n\n### Testing Strategy\nGiven the above prompts and the generated config, w, we will make a simple app with styles and create a similar config.  In addition, we will add a \nconfiguration for [**webpack-dev-server**](https://webpack.github.io/docs/webpack-dev-server.html), as that is a \ncommon feature item found in a lot of projects.\n\n## Observations / Feedback\n1.  When running  `webpack-cli init`, the prompt for location could make it clearer that an extension isn't required","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthescientist13%2Fwebpack-migrate-sandbox","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthescientist13%2Fwebpack-migrate-sandbox","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthescientist13%2Fwebpack-migrate-sandbox/lists"}