1
00:00:00,920 --> 00:00:04,059
We just ran a bundler a couple of times and observed the output.

2
00:00:04,250 --> 00:00:08,140
I want to very quickly summarize exactly what the bundler was doing for us step by step.

3
00:00:08,630 --> 00:00:09,740
So we ran a bundler.

4
00:00:09,740 --> 00:00:13,730
In our case, it was Watpac and it executed this series of steps you see right here.

5
00:00:14,390 --> 00:00:18,980
The first thing that occurred, the bundler read the contents of our entry file or essentially the main

6
00:00:18,980 --> 00:00:20,930
file instead of our application for you and I.

7
00:00:20,930 --> 00:00:22,490
That was the index file.

8
00:00:23,150 --> 00:00:27,830
The bundler then very clearly read through all the code inside that file.

9
00:00:28,040 --> 00:00:33,590
It passed all the code and found all the different import and export statements that we wrote into it.

10
00:00:34,370 --> 00:00:39,500
Then whenever we wrote an import or require statement, the bundler then found the module that we were

11
00:00:39,500 --> 00:00:40,940
looking for on our hard drives.

12
00:00:41,120 --> 00:00:43,700
In our case, that was the message file.

13
00:00:44,210 --> 00:00:48,890
So the bundler not only automatically read all the code inside of our file and also found the files

14
00:00:48,890 --> 00:00:50,180
that we were actually looking for.

15
00:00:50,900 --> 00:00:55,280
Once it found all these files and then took all the contents of these different files, join them all

16
00:00:55,280 --> 00:01:00,200
together and made sure that all the different values that we were importing and exporting were correctly

17
00:01:00,200 --> 00:01:02,690
linked up between these different modules.

18
00:01:03,470 --> 00:01:05,800
So that kind of summarizes what the bundler was doing.

19
00:01:06,290 --> 00:01:10,610
But this still doesn't really kind of solve or answer how we're going to address big challenge number

20
00:01:10,610 --> 00:01:11,210
three over here.

21
00:01:11,750 --> 00:01:13,690
Well, it almost kind of does.

22
00:01:13,700 --> 00:01:18,920
Let me show you one little change we can make to the behavior of a bundler and have it kind of solve

23
00:01:19,250 --> 00:01:20,660
big challenge number three for us.

24
00:01:22,540 --> 00:01:28,300
So if we somehow got a bundler that did all the same kind of stuff but did one step just slightly differently,

25
00:01:28,510 --> 00:01:31,770
then we would be able to perfectly solve big problem number three.

26
00:01:32,470 --> 00:01:37,180
So rather than trying to find some model on our hard drive, whenever a user writes out an important

27
00:01:37,180 --> 00:01:41,980
statement, we want to make sure that our slightly different bundler will attempt to instead find a

28
00:01:41,980 --> 00:01:44,850
module that a user imports directly from NPM.

29
00:01:44,860 --> 00:01:50,170
Because remember, inside of our application, we want to allow user to just import react or Lodish

30
00:01:50,200 --> 00:01:52,180
or Axios or any arbitrary module.

31
00:01:52,870 --> 00:01:58,510
So we want a Bandler where instead of trying to find a model on our hard drive, we want the bundler

32
00:01:58,520 --> 00:02:04,480
to reach out to NPM directly and try to get the source code for that module and include it inside of

33
00:02:04,480 --> 00:02:05,340
our output bundle.

34
00:02:05,920 --> 00:02:06,450
That's it.

35
00:02:06,460 --> 00:02:07,720
That's all we really have to do.

36
00:02:07,720 --> 00:02:12,580
If we can find a bundler or somehow change a bundler to do this step right here, then we will have

37
00:02:12,580 --> 00:02:16,450
solved problem number three, with one very small exception of it.

38
00:02:16,450 --> 00:02:18,330
Won't quite handle CSFs just yet.

39
00:02:19,060 --> 00:02:22,690
So that's our next big challenge or kind of a sub challenge, I guess, of number three.

40
00:02:22,930 --> 00:02:28,300
We need to figure out how we can take some existing bundler like Watpac or something similar and just

41
00:02:28,300 --> 00:02:28,840
change out.

42
00:02:28,840 --> 00:02:33,370
This one single step right here, if we can figure that out, will be in really good shape.

43
00:02:33,960 --> 00:02:38,230
So let's take a look at a couple of options or a couple of different ways we can implement this slightly

44
00:02:38,230 --> 00:02:40,030
different change right here in just a moment.