Restore documentation website · Issue #3762 · webpack/webpack.js.orgYou signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
How to build minified and uncompressed bundle with webpack?
webpack.config.js: const webpack = require("webpack"); module.exports = { entry: { "bundle": "./entry.js", "bundle.min": "./entry.js", }, devtool: "source-map", output: { path: "./dist", filename: "[name].js" }, plugins: [ new webpack.optimize.UglifyJsPlugin({ include: /\.min\.js$/, minimize: true }) ] }; Since Webpack 4, webpack.optimize.UglifyJsPlugin has been deprecated and its use results in e
webpackã¨Babelã®åŸºæœ¬ã‚’ç†è§£ã™ã‚‹(1) ―webpack編― - Qiita
独å¦ã®å†…容をã¾ã¨ã‚ãŸã‚‚ã®ã§ã™ã€‚誤りãŒã”ã–ã„ã¾ã—ãŸã‚‰ã€ã”連絡ã„ãŸã ã‘ã‚‹ã¨å¹¸ã„ã§ã™ã€‚ リンク webpackã¨Babelã®åŸºæœ¬ã‚’ç†è§£ã™ã‚‹(1) ―webpack編―（本記事） webpackã¨Babelã®åŸºæœ¬ã‚’ç†è§£ã™ã‚‹(2) ―Babel編― webpackã¨Babelã®åŸºæœ¬ã‚’ç†è§£ã™ã‚‹(3) ―webpackã¨Babel編― webpackã¨Babelã®åŸºæœ¬ã‚’ç†è§£ã™ã‚‹(4) ―React編― webpackã¨Babelã®åŸºæœ¬ã‚’ç†è§£ã™ã‚‹(5) ―Sass編― æ¦‚è¦ ã“ã®è¨˜äº‹ã®æ¦‚è¦ ç›®çš„ フãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã®ç’°å¢ƒæ§‹ç¯‰ã«åˆ©ç”¨ã•ã‚Œã‚‹ãƒ„ールã¸ã®ç†è§£ã‚’æ·±ã‚ã‚‹ 本記事ã®ã‚´ãƒ¼ãƒ« webpackã§JSファイルをçµåˆã™ã‚‹æ–¹æ³•ã‚’知る 対象者 WEBフãƒãƒ³ãƒˆæ‹…当者 HTML,CSS,JavaScript(es2015å«ã‚€)ã®åŸºæœ¬çš„ãªæ§‹æ–‡ã‚’ç†è§£ã—ã¦ã„る人 npmã®åˆ©ç”¨æ–¹æ³•ã‚’ç†è§£ã—ã¦ã„る人 環境・ãƒãƒ¼ã‚¸ãƒ§ãƒ³ Windows1
webpack 3 を使ã£ãŸã‚¦ã‚§ãƒ–ãƒšãƒ¼ã‚¸é–‹ç™ºæ‰‹é †
webpack 3 を使ã£ã¦ã€ç°¡å˜ãªã‚¦ã‚§ãƒ–ページを開発ã™ã‚‹æ‰‹é †ã‚’紹介ã—ã¾ã™ã€‚ã‚ãã¾ã§ä¸€ã¤ã®ä¾‹ã§ã™ã€‚ 1ã¤1ã¤ç´°ã‹ã„説明ã¯ã§ãã¦ã„ã¾ã›ã‚“ãŒã€ã€Œã ã„ãŸã„ã“ã‚“ãªãµã†ã«ã—ã¦ä½œã‚‹ã“ã¨ãŒã§ãã¾ã™ã‚ˆã€ã¨ã„ã†ã“ã¨ãŒä¼ã‚ã‚Œã°ã„ã„ãªã¨æ€ã£ã¦ã„ã¾ã™ã€‚ スãƒãƒ³ã‚µãƒ¼ãƒ‰ãƒªãƒ³ã‚¯ webpack 3 を使ã£ãŸã‚µãƒ³ãƒ—ルページ全ã¦ã®ãƒ•ã‚¡ã‚¤ãƒ«ã¯ã€ä»¥ä¸‹ã®ãƒšãƒ¼ã‚¸ã‹ã‚‰ãƒ€ã‚¦ãƒ³ãƒãƒ¼ãƒ‰ã™ã‚‹ã“ã¨ãŒã§ãã¾ã™ã€‚ laboradian/webpack3-sample001: webpack 3 を使ã£ãŸã‚µãƒ³ãƒ—ルプãƒã‚¸ã‚§ã‚¯ãƒˆãƒ†ã‚¹ãƒˆã«é–¢ã—ã¦ã¯ã€Mocha を使ã£ãŸå˜ä½“テストã®ã¿è¡Œã£ã¦ã„ã¾ã™ã€‚ 2. 注æ„äº‹é …ã‚µãƒ¼ãƒãƒ¼å´ã®ãƒ—ãƒã‚°ãƒ©ãƒŸãƒ³ã‚°ï¼ˆPHP ãªã©ï¼‰ã¯ã‚ã‚Šã¾ã›ã‚“。3. 環境OS Windows 10 Pro以下ã®ã‚¢ãƒ—リケーションãŒã‚¤ãƒ³ã‚¹ãƒˆãƒ¼ãƒ«ã•ã‚Œã¦ã„ã‚‹ã“ã¨ã‚’å‰æã¨ã—ã¦ã„ã¾ã™ã€‚ Node.js 今回ã¯ã€Windows 上ã§ã®ä½œæ¥ã§ã‚ã‚‹ãŸã‚ã€ã€ŒWindow
webpackã§ejsを使ã„ã€å…±é€šè¦ç´ をインクルードã—ã¦åŠ¹çŽ‡çš„ã«ã‚„ã‚ŠãŸã„よã。
数ページã®ã‚µã‚¤ãƒˆã¨ã¯ã„ãˆãƒ†ãƒ³ãƒ—レ化ã¯ã—ãŸã„ã€includeを使ã†ã¨å…±é€šè¦ç´ を外部ファイル化ã§ãã¦åŠ¹çŽ‡ã„ã„よã。サンプルã¨ã—ã¦ãƒ•ã‚¡ã‚¤ãƒ«ã¯ä»¥ä¸‹ã«ãŠã¦ã¾ã™ã€‚ https://github.com/shigekitakeguchi/yarn-webpack-ejs ã¡ã‚‡ã£ã¨ã—ãŸã€ä¾‹ãˆã°ãƒ–ランドサイトã¨ã‹ã‚ャンペーンサイトã€å°è¦æ¨¡ãªä¼æ¥ã‚„組織ã€ãŠåº—ã®ã‚µã‚¤ãƒˆã¨ã„ã†ã¨æ§‹æˆã«ã‚ˆã£ã¦ã¯1ページã£ã¦ã“ã¨ã‚‚ã‚ã‚‹ã‘ã©æ•°ãƒšãƒ¼ã‚¸ã‹ã‚‰20ページãらã„ã®è¦æ¨¡ã«ãªã‚‹ã¨æ€ã†ã€‚ ã„ã‚„ã„ã‚„ã‚‚ã£ã¨ã‚るよã£ã¦ã“ã¨ã«ãªã‚‹ã‹ã‚‚ã—ã‚Œãªã„ã‘ã©ä»Šå›žç´¹ä»‹ã—よã†ã¨æ€ã†ã‚„ã‚Šæ–¹ã¯æ•°ãƒšãƒ¼ã‚¸ã‹ã‚‰20ページãらã„ã®è¦æ¨¡ã®ã‚‚ã®ãŒä¾¿åˆ©ãªã‚“ã˜ã‚ƒãªã„ã‹ãªã€‚ ãれ以上ã®ã‚µã‚¤ãƒˆã«ãªã‚‹ã¨ã‚‚ã†ã¡ã‚‡ã£ã¨æœ¬æ ¼çš„ãªé™çš„サイトジェãƒãƒ¬ãƒ¼ã‚¿ãƒ¼ã¨ã‹ã‚’検討ã—ãŸã»ã†ãŒè‰¯ã„ã¨æ€ã†ã€‚ 数ページã¨ã¯ã„ãˆãƒ˜ãƒƒãƒ€ãƒ¼ã‚„フッターã€ã‚ã¨metaè¦ç´ やナビゲーションã€ç´°ã‹ã„ã¨ã“ã‚ã§ã„ã†ã¨Google An
最新版ã§å¦ã¶webpack 4入門 – JavaScript開発ã§äººæ°—ã®ãƒãƒ³ãƒ‰ãƒ«ãƒ„ール - ICS MEDIA
webpack（ウェブパック）ã¨ã¯JSファイルをã¾ã¨ã‚る高機能ãªãƒ¢ã‚¸ãƒ¥ãƒ¼ãƒ«ãƒãƒ³ãƒ‰ãƒ©ãƒ¼ã€‚ã¾ã¨ã‚ã‚‹ã“ã¨ã§ã‚¦ã‚§ãƒ–ページã®HTTPリクエストã®æ•°ã‚’減らã—ãŸã‚Šã€é«˜åº¦ãªã‚¦ã‚§ãƒ–アプリケーションã®é–‹ç™ºã«å½¹ç«‹ã¡ã¾ã™ã€‚ 連載ã§ã¯TypeScriptã‚„Babelãªã©ã®ES2015+ã®ç’°å¢ƒæ§‹ç¯‰ã€Reactãªã©ã®JSライブラリã®è¨å®šæ–¹æ³•ã‚’網羅。サンプルファイルã§è©³ã—ã解説ã—ã¾ã™ã€‚ webpackã®å…¥é–€è¨˜äº‹ã¯ä»–ã®ã‚µã‚¤ãƒˆã«ã‚‚ã‚ã‚Šã¾ã™ãŒã€å¯¾è±¡ãƒãƒ¼ã‚¸ãƒ§ãƒ³ãŒå¤ãã¦ä½¿ãˆãªã‹ã£ãŸã‚Šã—ã¾ã™ã€‚検索çµæžœã®ä¸Šä½ã®é‡Žè‰¯è¨˜äº‹ã‚’å‚ç…§ã«ã—ãŸã‚‰å¤ã„ãƒãƒ¼ã‚¸ãƒ§ãƒ³ã®å†…容ã°ã‹ã‚Šã€‚解説記事通りã«ã‚„ã£ãŸã®ã«ã†ã¾ãå‹•ã‹ãªã„･･･ãªã‚“ã¦å›°ã£ãŸæ–¹ã‚‚多ã„ã®ã§ã¯ãªã„ã§ã—ょã†ã‹ã€‚本記事ã¯å¸¸ã«æœ€æ–°ç‰ˆã«å¯¾å¿œã•ã›ã¦ã„ã‚‹ã®ã§ã€å®‰å¿ƒã—ã¦èªã¿é€²ã‚ã¦ãã ã•ã„。 ※本記事ã§ã¯2025å¹´5月ç¾åœ¨ã®webpack 5（2020å¹´10月リリース）以上ã§è§£èª¬ã—ã¦ã„ã¾ã™ã€‚ 本記事ã§è§£èª¬ã—ã¦ã„ã‚‹ã“
1
ランã‚ング
ランã‚ング
メンテナンス
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
{{#tags}}- {{label}}
{{/tags}}