Let's start to ramp up the difficulty here just a little bit and start making some changes to this plug
in right now, we're going to add a lot of code to this plug in, but we're going to eventually extract
it into several different plug ins.
Let me tell you about the first change we're going to make at present.
We've got these two hardcoded files inside this plug in.
I want to replace or make an update to one of these files.
I want to attempt to import a package directly from NPM.
Let's first begin by taking a look at the package that we're going to try to import.
So instead of a new browser tab, I'm going to navigate to unpackaged dotcom as tiny test package or
pkg.
If you navigate to that address, you're going to see the contents of this package are simply modeled
on exports.
Hi there.
So this is a very small package I put together just so we can attempt to try to fetch a single file
off of unpackaged package and include it into our bundle.
So essentially, rather than having our hardcoded.
Inside the plug in this hardcoded expert default of hi there, right there, I now want to try to match
the contents of some other file, essentially off of Unpackaged.
So here's the first thing we're going to do, I'm going to first begin by removing that case, we're
not going to rely upon this hardcoded return statement right here.
And then going to update the import statement.
Inside of these index dogs file to say important message from tiny test package.
So this kind of simulates what a user is going to eventually do inside of our application.
Remember, we want them to put in something very simple, like react or react, dom or axios or whatever
else.
So by putting in just tiny test package, this really simulates what a user is going to eventually do
inside of our app.
If I now save this and go back over to my browser.
Refresh the page and click on Submit will very quickly start to see an error message.
Now, really quick, I want you to really take a look at this error message.
The error says that we could not load this file.
That means that Eskild doesn't have any idea how to load this file up.
That means we have to implement some kind of case inside of possibly our own resolve or unload callbacks
and help instruct us build on how it can somehow find this module that it's attempting to load.
So that's our goal.
Let's start to make some updates to the onload and on result functions in the next video.