問題描述

webpack.congfig.js

var HtmlWebpackPlugin = require(’html-webpack-plugin’);var CleanWebpackPlugin = require(’clean-webpack-plugin’);var OpenBrowserPlugin = require(’open-browser-webpack-plugin’);module.exports = { // 這是一個(gè)主文件包括其他模塊 entry: ’./src/main.js’, // 編譯的文件路徑 output: { //`dist`文件夾 path: ’./dist’, // 文件 `build.js` 即 dist/build.js filename: ’build.js’ }, module: { // 一些特定的編譯規(guī)則 loaders: [ {// 讓webpack去驗(yàn)證文件是否是.js結(jié)尾將其轉(zhuǎn)換test: /.js$/,// 通過babel轉(zhuǎn)換loader: ’babel’,// 不用轉(zhuǎn)換的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: { //建立本地服務(wù)器contentBase: './',port: 9200,inline: true },}

命令行執(zhí)行webpack，輸出dist文件夾，雙擊文件夾打開，頁面顯示正確

命令行執(zhí)行webpack-dev-server,就沒有輸出dist文件夾，localhost訪問的時(shí)候就報(bào)錯(cuò)了，因?yàn)闆]有js文件存在

請(qǐng)問這是什么原因？為什么webpack-dev-server的時(shí)候沒有輸出文件夾？

問題解答

webpack-dev-server不會(huì)輸出實(shí)際文件，都是在內(nèi)存里的。

試試contentBase: path.resolve(__dirname,'你的路徑')

webpack-dev-server不是輸出文件，只是給本地開發(fā)提供了一個(gè)的服務(wù)器，方便開發(fā)而已，在打包的時(shí)候才會(huì)輸出文件的。localhost訪問的時(shí)候需要加上端口，就是你現(xiàn)在的配置的9200