Order of required fies

[raedatoui]

trafficstars

Hello and thank you for creating this! So I am having an issue with the order in which these files are included.

Here is how I add various THREE.js files

require("globals!../third_party/three.js");
require('globals!../third_party/Detector.js');

require('globals!../third_party/shaders/CopyShader.js');
require('globals!../third_party/shaders/ParticlesShader.js');
require('globals!../third_party/shaders/DigitalGlitch.js');
require('globals!../third_party/shaders/HorizontalBlurShader.js');
require('globals!../third_party/shaders/VerticalBlurShader.js');

require('globals!../third_party/postprocessing/EffectComposer.js');
require('globals!../third_party/postprocessing/RenderPass.js');
require('globals!../third_party/postprocessing/MaskPass.js');
require('globals!../third_party/postprocessing/ShaderPass.js');
require('globals!../third_party/postprocessing/GlitchPass.js');
require('globals!../third_party/postprocessing/FilmPass.js');

And in the generated vendor.js I see that THREE.CopyShader is included before the main Three file.

Here is my webpack config:

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

module.exports = {

  entry: {
    app: path.resolve(__dirname, '../src/client/page.js'),
  },

  output: {
    path: path.resolve(__dirname, '../dist'),
    filename: 'bundle.js'
  },
  resolve: {
      alias: {
        'THREE': path.resolve(__dirname + '../src/client/third_party/three.js'),
        'Detector': path.resolve(__dirname + '../src/client/third_party/Detector.js')
      }
  },
  module: {
    loaders: [
      {
        test: /src\/.+.js$/,
        exclude: /node_modules/,
        loader: 'babel'
      },
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract('css!sass')
      }
    ]
  },

  sassLoader: {
    includePaths: [path.resolve(__dirname, '../src/client/sass')]
  },

  plugins: [
    new ExtractTextPlugin('style.css', {
        allChunks: true
    }),
    new webpack.optimize.UglifyJsPlugin({
      minimize: false
    })
  ]
};

Any ideas on enforcing order? Apologies, I am a bit new to all this front end stuff. Willing to make a PR if you can point me in the right direction

[bensampaio]

Hi @raedatoui, unfortunately I came across this same problem and couldn't find a solution. I believe the way I implemented the loader is wrong and that's why this happens but I cannot understand from the webpack documentation how could this be implemented correctly. Since I want the files to be handled differently I think some custom compiler is necessary but I can't understand how to accomplish that.