{"id":20766153,"url":"https://github.com/navono/webpack-es6","last_synced_at":"2025-10-26T04:14:52.993Z","repository":{"id":74497429,"uuid":"93609043","full_name":"navono/webpack-es6","owner":"navono","description":"A demo for webpack and es6","archived":false,"fork":false,"pushed_at":"2017-07-11T03:09:21.000Z","size":277,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-26T03:36:28.352Z","etag":null,"topics":["javascript"],"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/navono.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-06-07T08:04:05.000Z","updated_at":"2017-06-07T08:07:12.000Z","dependencies_parsed_at":null,"dependency_job_id":"d90fd239-6000-42f2-bfaf-0e943894c08b","html_url":"https://github.com/navono/webpack-es6","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/navono%2Fwebpack-es6","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/navono%2Fwebpack-es6/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/navono%2Fwebpack-es6/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/navono%2Fwebpack-es6/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/navono","download_url":"https://codeload.github.com/navono/webpack-es6/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243093948,"owners_count":20235465,"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":["javascript"],"created_at":"2024-11-17T11:21:41.225Z","updated_at":"2025-10-26T04:14:52.917Z","avatar_url":"https://github.com/navono.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"Q: 这样子做的话，和html中直接引用源文件效果是一样的啊。话说为什么要编译啊？这样不是更麻烦吗？\n\nA: 编译其实是为了实现模块化。基于AMD/CMD/CommonJS/es6的语法，浏览器是无法识别的。这些规范的语法，可以感受一下：\n\n```js\n //AMD\nrequire(['moduleA', 'moduleB', 'moduleC'], function (moduleA, moduleB, moduleC)\n{\n    alert('加载成功');\n});\n\n//CMD\nseajs.use(\"../static/hello/src/main\")\n\n//CommonJS\nmodule.export = {\n    name:'rouwan'\n}\n\n//es6模块\nimport {module1, module2} form './module.js';\n```\n\nnpm install babel-core babel-loader babel-preset-es2015\n\n为了便于调试，我们全局安装一个http-server,用于启动我们的项目。\n安装http-server\n\nnpm install http-server -g\n运行 http-server ./dist -o\n\n打开浏览器访问[http://127.0.0.1:8080/,]\n\n\n在命令中输入：webpack -w，生成编译后的js文件。\n\n---\n\nwebapck-dev-server 使用内存编译\nHMR 不适用于生产环境，这意味着它应当只在开发环境使用。\n其他的loader包括：\nreact hot loader\nvue loader\nredux HMR\n\n---\n\n生产环境中使用webpack -p(也可以运行 webpack --optimize-minimize --define process.env.NODE_ENV=\"production\"，他们是等效的)。会执行以下步骤：\n- 使用UglifyJsPlugin进行JS文件压缩（此插件只支持ES5，因此需要借助babel）\n- 运行LoaderOptionsPlugin\n- 设置NodeJS环境变量，触发某些package包，以不同的方式进行编译\n\n\n这是来自navonoTest的修改。","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnavono%2Fwebpack-es6","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnavono%2Fwebpack-es6","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnavono%2Fwebpack-es6/lists"}