小编Har*_*eet的帖子

我的 webpack 在启动和发生变化时运行速度非常慢 - 编译。实际上现在开发非常缓慢。我只使用 greensock 作为供应商，但没有别的。我也只使用了几张图片……不确定。

这是代码：

const path = require('path');
var webpack = require('webpack');
var htmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require('extract-text-webpack-plugin');

// const ASSET_PATH = process.env.ASSET_PATH || '/'; ,
//publicPath: '/dist'

var isProd = process.env.NODE_ENV === 'production';
var cssDev = ['style-loader', 'css-loader', 'sass-loader'];

const VENDOR_LIBS =['gsap'];

var cssProd = ExtractTextPlugin.extract({
    fallback: 'style-loader',
    use: [
        'css-loader', 'sass-loader'
    ],
    publicPath: '/dist'
});

var cssConfig = isProd ? cssProd : cssDev;

module.exports = {
    entry: {
        index: './src/js/index.js',
        vendor: VENDOR_LIBS …

我的JavaScript正在加载样式之前，这会导致跳跃和奇怪的加载。

这是我的演示：https : //harp29.github.io/cb-pc/

如何通过Webpack运行JavaScript文件之前，如何加载styles / css文件？我尝试了setTimeout功能，但是它起作用了，但这是一个临时解决方案，那是解决此问题的最佳方法？

我的webpack文件：webpack.dev.js

const path = require("path")
const webpack = require("webpack")
const HTMLWebpackPlugin = require("html-webpack-plugin")
// const cssDev = ['style-loader', 'css-loader?sourceMap', 'sass-loader?sourceMap'];

module.exports = {
  entry: {
    main: [
      "webpack-hot-middleware/client?reload=true",
      "./src/script/main.js"
    ]
  },
  mode: "development",
  output: {
    filename: "[name]-bundle.js",
    path: path.resolve(__dirname, "../dist"),
    publicPath: "/"
  },
  devServer: {
    contentBase: "dist",
    overlay: true,
    stats: {
      colors: true
    }
  },
  devtool: "source-map",
  module: {
    rules: [{
        test: /\.js$/,
        exclude: /node_modules/,
        use: [{
          loader: "babel-loader"
        }] …