require.js Routing Problem

In the demo exercise requirejs of hopping on a path which is set up a lot of pits, here come them out, I pro-test valid

demo directory structure is as follows

 

 Wherein dependent on a b, main entrance as the loaded file

In the case of not setting baseUel

1.1. When requirejs only be included in the html page, useless and increases data-main set

index page

 

 At this time, js file load path to load the root path index.html page as a reference, in the main.js

 

 result

 

 Modify main.js

 

 or

 

 Note: The "/" at the beginning to add the suffix .js

1.2. When the increased data-main items only

In the index page

 

 

At this time main.js file asynchronously loaded, loaded requirejs after loading is completed, the file path Js loaded data-main path is set as the reference

Modify main.js file

 

 result

 

 Modify main.js file

 

 In the case of setting baseUrl

2.1. When baseUrl to "/"

In this case, the load path ja root file as a reference, modified main.js

 

 result:

 

 Modify main.js

 

 2.2. In baseUrl not "/"

In this case, the root path js file loaded path to load the page index as a benchmark

1. Modify main.js

 

 result:

 

 Modify it again: by

 

2. Modify main.js

 

 result:

 

 Modify main.js

 

 

The above relation for the case where a path is provided between the inlet and the start page index.html file js main.js, will be described below js file having a path between a set dependency. In front of the directory structure screenshot, a.js b.js dependent on, dependent upon the a.js b.js, the file may be a.js b.js write path as a reference, as follows

 

The base case can also be a path in front when it comes to writing b.js path

 

 

 

 

 

Note: baseUrl set to " / " with caution

Because in actual development, isolated front and rear ends generally used manner, the deployment of the code, the front end of the code storage folder is not necessarily stored in the root directory, for this comparison may be run on the code webstrom and vscode clearly understand the similarities and differences.

The test of the demo code I put require file, the following is the case opened in a browser

 

WEBSTRA:

 

 

Vscode:

As can be seen, the results of running the same code in different opening tool is different, can be clearly seen in webstrom require path is added, so baseUrl set to "/", the first path is a "/" with reference to the load, so modify the main.js in webstrom

 

 

 require module loaded situations:

 

Guess you like

Origin www.cnblogs.com/onyli/p/11571685.html