javascript - webpack-dev-server和webpack冲突吗

问题描述

webpack.congfig.js

var HtmlWebpackPlugin = require(’html-webpack-plugin’);var CleanWebpackPlugin = require(’clean-webpack-plugin’);var OpenBrowserPlugin = require(’open-browser-webpack-plugin’);module.exports = { // 这是一个主文件包括其他模块 entry: ’./src/main.js’, // 编译的文件路径 output: { //`dist`文件夹 path: ’./dist’, // 文件 `build.js` 即 dist/build.js filename: ’build.js’ }, module: { // 一些特定的编译规则 loaders: [ {// 让webpack去验证文件是否是.js结尾将其转换test: /.js$/,// 通过babel转换loader: ’babel’,// 不用转换的node_modules文件夹exclude: /node_modules/ }, { test: /.vue$/, loader: ’vue’ } ] }, vue: { loaders: { js: ’babel’ } }, plugins: [ new HtmlWebpackPlugin({template:’./index.html’,filename: ’assets/index.html’ }), new CleanWebpackPlugin(’./dist’), ], devServer: { //建立本地服务器contentBase: './',port: 9200,inline: true },}

命令行执行webpack，输出dist文件夹，双击文件夹打开，页面显示正确

命令行执行webpack-dev-server,就没有输出dist文件夹，localhost访问的时候就报错了，因为没有js文件存在

请问这是什么原因？为什么webpack-dev-server的时候没有输出文件夹？

问题解答

webpack-dev-server不会输出实际文件，都是在内存里的。

试试contentBase: path.resolve(__dirname,'你的路径')

webpack-dev-server不是输出文件，只是给本地开发提供了一个的服务器，方便开发而已，在打包的时候才会输出文件的。localhost访问的时候需要加上端口，就是你现在的配置的9200