本地服務(wù)上運(yùn)行結(jié)果如下（沒有報(bào)錯(cuò)）

webpack-dev-server運(yùn)行正常 如下

router.js

export default [{
    path: '/',
    component: App,
    children: [
        {path: '', component: index},
        {path: 'orderDetail', component: orderDetail},
        {path: 'join', component: join},
        {path: 'about', component: about},
        {path: 'login', component: login,
            children: [
                {path: '/', component: login1},
                {path:'/login/reg',component:reg},
                {path:'/login/forgetPwd',component:forgetPwd},
                {path:'/login/agreement',component:agreement}
            ]
        },
        {
            path: "city", component: city,
            children: [
                {path: '/', component: cityList},
                {path: '/city/cityChose', component: cityChose},
            ]
        },
        {
            path: 'pc', component: pc,
            children: [
                {path: '/', component: pcInfo},
                {path: '/pc/pcInfoPwd', component: pcInfoPwd},
                {path: '/pc/pcInfoTel', component: pcInfoTel},
            ]
        },
    ]
}];

app.js

import Vue from 'vue';
import VueRouter from "vue-router";
import routes from './router/router';
import {sendAjax} from './util/ajax';
import VueLazyLoad from 'vue-lazyload';
import {icon} from './util/config';
const router = new VueRouter({
    mode: 'history',
    routes:routes
});

Vue.prototype.sendAjax = sendAjax;
Vue.use(VueRouter);
Vue.use(VueLazyLoad, {
    preLoad: 1.3,
    error: icon.error,
    loading: icon.loading,
    attempt: 1
});
new Vue({
    router,
}).$mount("#app");

webpack.config.js

//引入webpack插件
let webpack = require("webpack");
// 生成HTML插件
let html = require("html-webpack-plugin");
// 刪除文件插件（后面用到刪除www文件夾）
let clean = require("clean-webpack-plugin");
let CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin");
//用到的模塊
module.exports = {
    //入口文件
    entry:{
        "app":"./app/app.js",
        chunk: ["./app/conmmon/js/fastclick.js","./app/conmmon/js/jquery-weui.min.js"]
    },
    //輸出
    output:{
        //輸出地址，會(huì)自動(dòng)創(chuàng)建文件夾www
        path:__dirname+"/www/",
        //輸出命名
        publicPath: "",
        filename:"[name].js"
    },
    //用到的模塊，基本上常用的就是這幾個(gè)
    module:{
        loaders:[
            {
                //css打包，使用正則表達(dá)式識(shí)別樣式文件，常用用到了style-loader、css-loader、less-loader模塊
                test:/\.css$/,
                loader:"style-loader!css-loader!less-loader"
            },
            {
                //圖片打包，limit限制打包的圖片大小和圖片放到imges文件下使用原名字，使用4位的hash值防止命名相同而沖突，使用原來的擴(kuò)展名
                test:/\.(png|jpe?g|gif)$/,
                loader:"url-loader?limit=1000&name=images/[name].[hash:4].[ext]"
            },
            {
                //vue文件打包
                test:/\.vue$/,
                loader:"vue-loader"
            },
            {
//字體打包
                test:/\.(woff|svg|eot|ttf)\??.*$/,
                loader:"url-loader?name=fonts/[name].[md5:hash:hex:7].[ext]"
            }
        ]
    },
    //使用插件
    plugins:[
//生成html，標(biāo)題，用到的模板
        new html({
            title:"家先生",
            template:__dirname+"/app/index.html",
            filename:"index.html",
        }),
        // new clean(["www"]),
        new webpack.ProvidePlugin({
            jQuery: "jquery",
            $: "jquery"
        }),
        new CommonsChunkPlugin({
            name: "chunk"
        })
    ],
    //sudo npm install webpack-dev-server -g 設(shè)置自動(dòng)刷新和端口
    devServer: {
        contentBase:"./www",
        inline: true,
        historyApiFallback: true,
        port: 8088
    },
    resolve:{
        alias: {
            'vue$': 'vue/dist/vue.common.js',
        }
    }
};

項(xiàng)目結(jié)構(gòu)