javascript - webpack-dev-server和webpack冲突吗
本文介绍了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不会输出实际文件,都是在内存里的。
这篇关于javascript - webpack-dev-server和webpack冲突吗的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文