窗口加载事件只触发一次

时间:2016-10-04 22:32:16

标签: javascript webpack

目前我正在建设一个webpack的小项目,只要我尝试制作装载机,一切顺利。

loader.js文件中捆绑webpack后,我的window.onload事件仅在首页加载后触发,这肯定是缓存问题,但我无法弄清楚如何禁用/删除/修复这一点。

这里是我的设置:

webpack.prod.config.js

{
    entry: {
        home: "./assets/js/app/home.js",
        service: "./assets/js/app/service.js",
        contacts: "./assets/js/app/contacts.js"
    },
    output: {
        path: path.join(__dirname, "build/js"),
        publicPath: "/build/js",
        filename: "[name].bundle.min.js"
    },
    resolve: {
        alias: {
            "jquery": cfg.vendors + "/jquery.min",
            "jquery-validation": cfg.vendors + "/jquery.validate",
            "google-maps": cfg.vendors + "/Google.min.js"
        },
        extensions: ["", ".js", ".es6"]
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: "babel-loader"
            }
        ]
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.env': {
                'NODE_ENV': JSON.stringify(process.env.NODE_ENV)
            }
        }),
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery"
        }),
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                warnings: false
            }
        }),
        new CopyWebpackPlugin([
            { from: node_path + "/jquery/dist/jquery.min.js", to: cfg.vendors },
            { from: node_path + "/jquery-validation/dist/jquery.validate.js", to: cfg.vendors },
            { from: node_path + "/google-maps/lib/Google.min.js", to: cfg.vendors }
        ])
    ]
}

home.js

"use strict";

import $ from "jquery";
import Loader from "../utils/loader";
import ScrollTop from "../utils/scrollTop";

$(() => {
    new Loader();
    new ScrollTop();
});

loader.js

const LOAD_TIME = 3000;

let loaderHolder = $("#loader-holder"),
    body = $("body");

class Loader{

    constructor(){
        this._events();
    }
    _events(){
        $(window).on("load", (e) => { this._handleLoad(e) });
    }
    _handleLoad(e){

        setTimeout(() => {

            loaderHolder.addClass("loaded");
            body.addClass("loaded");

        }, LOAD_TIME);

        return false;
    }
}

export default Loader;

捆绑的npm任务:

"prod-build": "set NODE_ENV=production && webpack -p --config webpack.prod.config.js --progress"

任何帮助都将不胜感激。

0 个答案:

没有答案