{"id":1046,"date":"2022-08-13T11:10:00","date_gmt":"2022-08-13T03:10:00","guid":{"rendered":"http:\/\/blog.xrhoujie.com\/?p=1046"},"modified":"2022-07-27T17:39:01","modified_gmt":"2022-07-27T09:39:01","slug":"webpack%e5%ad%a6%e4%b9%a0%e7%ac%94%e8%ae%b0-%e6%89%93%e5%8c%85%e5%85%b6%e5%ae%83%e8%b5%84%e6%ba%90%ef%bc%8cdevserver3","status":"publish","type":"post","link":"http:\/\/blog.xrhoujie.com\/?p=1046","title":{"rendered":"webpack\u5b66\u4e60\u7b14\u8bb0-\u6253\u5305\u5176\u5b83\u8d44\u6e90\uff0cdevServer(3)"},"content":{"rendered":"\n<pre class=\"wp-block-code\"><code><strong>\u6253\u5305\u975ehtml\uff0ccss\uff0cjs\u8d44\u6e90<\/strong>\nconst { resolve } = require('path');\r\nconst HtmlWebpackPlugin = require('html-webpack-plugin');\r\n\r\nmodule.exports = {\r\n  entry: '.\/src\/index.js',\r\n  output: {\r\n    filename: 'built.js',\r\n    path: resolve(__dirname, 'build')\r\n  },\r\n  module: {\r\n    rules: &#91;\r\n      {\r\n        test: \/\\.css$\/,\r\n        use: &#91;'style-loader', 'css-loader']\r\n      },\r\n      \/\/ \u6253\u5305\u5176\u4ed6\u8d44\u6e90(\u9664\u4e86html\/js\/css\u8d44\u6e90\u4ee5\u5916\u7684\u8d44\u6e90)\r\n      {\r\n        \/\/ \u6392\u9664css\/js\/html\u8d44\u6e90\r\n        exclude: \/\\.(css|js|html|less)$\/,\r\n        loader: 'file-loader',\r\n        options: {\r\n          name: '&#91;hash:10].&#91;ext]'\r\n        }\r\n      }\r\n    ]\r\n  },\r\n  plugins: &#91;\r\n    new HtmlWebpackPlugin({\r\n      template: '.\/src\/index.html'\r\n    })\r\n  ],\r\n  mode: 'development'\r\n};\n\r\n<strong>\u670d\u52a1\u5668\u81ea\u52a8\u5316\u4efb\u52a1\uff1a<\/strong>\nconst { resolve } = require('path');\r\nconst HtmlWebpackPlugin = require('html-webpack-plugin');\r\n\r\nmodule.exports = {\r\n  entry: '.\/src\/index.js',\r\n  output: {\r\n    filename: 'built.js',\r\n    path: resolve(__dirname, 'build')\r\n  },\r\n  module: {\r\n    rules: &#91;\r\n      {\r\n        test: \/\\.css$\/,\r\n        use: &#91;'style-loader', 'css-loader']\r\n      },\r\n      \/\/ \u6253\u5305\u5176\u4ed6\u8d44\u6e90(\u9664\u4e86html\/js\/css\u8d44\u6e90\u4ee5\u5916\u7684\u8d44\u6e90)\r\n      {\r\n        \/\/ \u6392\u9664css\/js\/html\u8d44\u6e90\r\n        exclude: \/\\.(css|js|html|less)$\/,\r\n        loader: 'file-loader',\r\n        options: {\r\n          name: '&#91;hash:10].&#91;ext]'\r\n        }\r\n      }\r\n    ]\r\n  },\r\n  plugins: &#91;\r\n    new HtmlWebpackPlugin({\r\n      template: '.\/src\/index.html'\r\n    })\r\n  ],\r\n  mode: 'development',\r\n\r\n  \/\/ \u5f00\u53d1\u670d\u52a1\u5668 devServer\uff1a\u7528\u6765\u81ea\u52a8\u5316\uff08\u81ea\u52a8\u7f16\u8bd1\uff0c\u81ea\u52a8\u6253\u5f00\u6d4f\u89c8\u5668\uff0c\u81ea\u52a8\u5237\u65b0\u6d4f\u89c8\u5668~~\uff09\r\n  \/\/ \u7279\u70b9\uff1a\u53ea\u4f1a\u5728\u5185\u5b58\u4e2d\u7f16\u8bd1\u6253\u5305\uff0c\u4e0d\u4f1a\u6709\u4efb\u4f55\u8f93\u51fa\r\n  \/\/ \u542f\u52a8devServer\u6307\u4ee4\u4e3a\uff1anpx webpack-dev-server\r\n  devServer: {\r\n    \/\/ \u9879\u76ee\u6784\u5efa\u540e\u8def\u5f84\r\n    contentBase: resolve(__dirname, 'build'),\r\n    \/\/ \u542f\u52a8gzip\u538b\u7f29\r\n    compress: true,\r\n    \/\/ \u7aef\u53e3\u53f7\r\n    port: 3000,\r\n    \/\/ \u81ea\u52a8\u6253\u5f00\u6d4f\u89c8\u5668\r\n    open: true\r\n  }\r\n};\r\n<\/code><\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[44,1],"tags":[],"_links":{"self":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts\/1046"}],"collection":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1046"}],"version-history":[{"count":1,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts\/1046\/revisions"}],"predecessor-version":[{"id":1047,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=\/wp\/v2\/posts\/1046\/revisions\/1047"}],"wp:attachment":[{"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1046"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1046"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/blog.xrhoujie.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1046"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}