Style scripting Localization Development method ① "tips for front-end development"

Friends, is not in front of the development of the time often need to modify CSS and JS code it?

When debugging code. Is the code repository constantly being modified? Same script style file n multiplayer operation? A variety of clean-up caches are required for mobile debugging ...

These problems will lead to a variety of front-end development inconvenience. Therefore, there is a need for a localized development approach: Directly modify the debug code locally, and then run it directly on the PC or mobile side. So, the debug code is much simpler and quicker. Helps the "selective" increase in productivity oh. (Why is it selective?) For example, the following method. Because this method must also have limitations. For example, an IP that is not on the LAN will not be able to load styles and scripts unless your local server is a WAN supported. So you must still be uploaded to the server after the local debugging, so generally only new requirements, the new code is more appropriate to use this method, the old requirements code is modified, it is not good to use local words modified. ）

Here are 2 ways: one is to take advantage of the local server, and the other is to use Youdao cloud notes. The next issue is the second method.

OK, now let's talk about how to use this style script localization to debug the front-end code.

1. Download the local server (here is a personal common PHP server)

: Http://pan.baidu.com/s/1qXDljgK (mother of the letter)

Install: Follow whichever disk you like to install.

When the installation is complete, there are 3 shortcuts to the desktop:

PHP server is a server startup program

Phpwww is the front-end file storage space (here we use to store CSS JS files that need debugging)

Mysqldata is the MySQL local database space (we don't need it here)

2. Create a local area network server

First, let's start the PHP server.

1. Here we choose to close

2. Here we click Start

3. It is generally recommended to use the third "Start & Access" link, when a local LAN server is created. The currently automatically opened home page is the local server home page that you just built up.

This means that the index.php in the Phpwww directory is the home page of the current server.

For example: My present address is:http://192.168.0.101:50080/

3. Create a LAN inline style script file

Create a directory in the Phpwww directory, such as JS

Enter the JS directory to create a JS file, such as New.js

Then save the code.

Then the absolute path address of the current script is:http://192.168.0.101:50080/js/new.js

4. Introducing a local debug-style script file in a network project

Here we'll try to introduce this local script

Add the code in the appropriate location on your server page:

<script src= "Http://192.168.0.101:50080/js/new.js" ></script>

Code for the page:

When you execute the Web page you build. The browser will load the file you just added.

Execution effect:

List of documents loaded by the browser

5. Debug a Style script

If you feel that there is a problem with the style script, you can directly change it directly in the local file, and then ctrl+s save it directly. Then refresh the page to

Note: The resources in this server are to be debugged on the mobile side. Need to be your computer with a WiFi network, then your phone is also connected to the same network. Then the debug code on the phone is also very simple.

Style scripting Localization Development method ① "tips for front-end development"