1. npm install --save-dev webpack-dev-server--->安装资源包 2. 配置 3. webpack 启动 换成 webpack-dev-server 启动 4. 启动以后不能直接使用，他并不会帮我们把dist文件夹更新在硬盘，而是存放在内存中 - 1. 并且他启动的web服务是以项目根目录作为根目录，并不是dist文件夹 - 2. 因此我们要在webpack.config.js文件中配置webpack-dev-server - 3. 我们可以在webpack文档中的开发中找到devServer.contentBase查阅并配置 //开发服务配置webpack-dev-server devServer:{ //配置以这个文件路径作为web服务的根路劲 contentBase:path.resolve(__dirname,‘./dist‘) } - 4. 配置npm的脚本，找到package.json文件在scripts对象中填写 - "dev":‘webpack-dev-server‘---开发时启动服务使用：npm run dev - "build":‘webpack‘----打包时使用命令：npm run webpack "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "dev": "webpack-dev-server", "build": "webpack" },
###. 引入模块的方式去引入css(样式)文件时报错
1. npm install --save-dev css-loader style-loader 2. 配置 3. //加载器 module:{ //定义加载器的规则 rules:[ { test:/\.css$/,//用正则的方式找到匹配的模块 //注意这个加载器书写时有顺序，必须倒叙写，第一步骤写在最底下 use:[ ‘style-loader‘, ‘css-loader‘ ]//使用什么加载器去处理这个模块 } ]
原文：https://www.cnblogs.com/boye-1990/p/10391372.html