按照老师的课程学习，npm run dev启动的devserver里css文件生效了，但是.vue文件的template和script代码不生效，style样式反而打包了。

webpack.config.js：

const path = require('path');
// const { VueLoaderPlugin } = require("vue-loader");
const VueLoaderPlugin = require('vue-loader/lib/plugin');
const HTMLPlugin = require('html-webpack-plugin');
const webpack = require('webpack');

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

const config  = {
      target:'web',
      entry: path.join(__dirname,'src/index.js'),
      output:{
          filename: 'bundle.js',
          path: path.join(__dirname,'dist'),
      },

     module:{
           rules:[
               {
                   test: /\.vue$/,
                   loader:'vue-loader'
                },
               {
                   test: /\.css$/,
                   // loader:'style-loader!css-loader!postcss-loader',
                   // loaders:[]
                   use: [
                       'style-loader',
                       'css-loader'
                   ]
               },
               {
                   test: /\.styl/,
                   use: [
                       'style-loader',
                       'css-loader',
                       'stylus-loader'
                   ]
               },
               {
                   test: /\.(gif|jpg|jpeg|png|svg)$/,
                   // loader:'style-loader!css-loader!postcss-loader',
                   // loaders:[]
                   use: [
                       {
                           loader:'url-loader',
                           options:{
                               limit:1024,
                               name:'[name]-aaa.[ext]'
                           }
                       }
                   ]
               },
           ],

     },

    plugins:[
        new webpack.DefinePlugin({
            'process.env':{
                NODE_ENV: isDev ? '"development"': '"production"'
            }
        }),
        new VueLoaderPlugin(),
        new HTMLPlugin()
    ],

    // mode: 'development' //设置mode



}

if(isDev){
    config.devtool = '#cheap-module-eval-source-map'//浏览器调试
    config.devServer = {
        port:8000,
        host:'0.0.0.0',//别人的电脑也能访问到
        overlay:{
            errors: true,
        },
        open: true,
        // historyFallback:{
        //
        // },//没有设置地址的路由映射到指定的地址，如index.html
        hot: true
    }
    config.plugins.push(
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NodeEnvironmentPlugin()
    )//热加载依赖
}

module.exports = config

index.js:

/**
 * Created by 59864 on 2020/10/11.
 */
import Vue from 'vue'
import App from './app.vue'

import './assets/styles/test.css'
import './assets/styles/test-stylus.styl'
import './assets/images/1.png'

const root = document.createElement('div')
document.body.appendChild(root)

new Vue({
    render: (h) => (App)
}).$mount(root)

app.vue:

<template>
    <div id="text">{{text}}
    <span>123</span>
    </div>

</template>

<script>
    export default{
        data(){
            return {
                text:'abc'
            }
        },
        mounted(){
            alert(1);
            console.log(123);
        },
    }
</script>

<style>
#text{
    color: black;
    width: 100px;
    height: 200px;
}
</style>

package.json：

{
  "name": "vue-webpack",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "cross-env NODE_ENV=production webpack --config webpack.config.js",
    "dev": "cross-env NODE_ENV=development webpack-dev-server  --config webpack.config.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "cross-env": "^7.0.2",
    "file-loader": "^6.2.0",
    "html-webpack-plugin": "^4.5.0",
    "stylus": "^0.54.8",
    "stylus-loader": "^4.2.0",
    "url-loader": "^4.1.1",
    "vue": "^2.6.12",
    "vue-loader": "^15.9.5",
    "vue-template-compiler": "^2.6.12",
    "webpack": "^4.32.2"
  },
  "devDependencies": {
    "css-loader": "^4.3.0",
    "style-loader": "^2.0.0",
    "webpack-cli": "^3.3.2",
    "webpack-dev-server": "^3.5.1"
  }
}