老师,这个问题困扰我好久了, 运行npm run practice启动成功后, 访问http://0.0.0.0:8080 ,页面显示目录和文件信息,看了贴也没能解决好..请大神告诉我如果解决呀..这样我才能继续下看,学习practice里面的示例代码呀..感谢了..

老师配置文件是这样的, 没有做什么修改.

webpack.config.base.js 配置

const path = require('path')
const createVueLoaderOptions = require('./vue-loader.config')

const isDev = process.env.NODE_ENV === 'development'

const config = {
  target: 'web',
  entry: path.join(__dirname, '../client/client-entry.js'),
  output: {
    filename: 'bundle.[hash:8].js',
    path: path.join(__dirname, '../public'),
    //这里的端口号要跟practice.js配置中的一样,否则控制台就会报错.
    publicPath: 'http://127.0.0.1:8080/public/'
  },
  module: {
    rules: [
      {
        test: /\.(vue|js|jsx)$/,
        loader: 'eslint-loader',
        exclude: /node_modules/,
        enforce: 'pre'
      },
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: createVueLoaderOptions(isDev)
      },
      {
        test: /\.jsx$/,
        loader: 'babel-loader'
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/
      },
      {
        test: /\.(gif|jpg|jpeg|png|svg)$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              limit: 1024,
              name: 'resources/[path][name].[hash:8].[ext]'
            }
          }
        ]
      }
    ]
  }
}
module.exports = config

webpack.config.practice.js 配置

const path = require('path')
const HTMLPlugin = require('html-webpack-plugin')
const webpack = require('webpack')
const merge = require('webpack-merge')
const baseConfig = require('./webpack.config.base')

const defaultPluins = [
  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: '"development"'
    }
  }),
  new HTMLPlugin({
    template: path.join(__dirname, 'template.html')
  })
]

const devServer = {
  //这里的端口号要跟base.js配置中的一样,否则控制台就会报错.
  port: 8080,
  host: '0.0.0.0',
  overlay: {
    errors: true
  },
  // 这里添加的配置,网页不显示目录结构了,但控制台报错:
  // Failed to load resource: net::ERR_CONNECTION_REFUSED
  historyApiFallback: {
    index: '/public/index.html'
  },
  hot: true
}

let config

config = merge(baseConfig, {
  entry: path.join(__dirname, '../practice/index.js'),
  devtool: '#cheap-module-eval-source-map',
  module: {
    rules: [
      {
        test: /\.styl/,
        use: [
          'vue-style-loader',
          'css-loader',
          {
            loader: 'postcss-loader',
            options: {
              sourceMap: true
            }
          },
          'stylus-loader'
        ]
      }
    ]
  },
  devServer,
  // import Vue from 'vue'
  resolve: {
    alias: {
      'vue': path.join(__dirname, '../node_modules/vue/dist/vue.esm.js')
    }
  },
  plugins: defaultPluins.concat([
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoEmitOnErrorsPlugin()
  ])
})

module.exports = config

现在添加了配置,网页无显示,但控制台报错: GET http://127.0.0.1:8000/public/bundle.d7126397.js net::ERR_CONNECTION_REFUSED

问题已经解决