In the previous chapter, we used npm for the installation project (Vue-cli and Vite), we open the directory in IDE (Vscode, Atom, etc.) with the following structure:
Command line tool vue-cli (runoob-vue3-test):
Vite（runoob-vue3-test2）
Directory / file Description Project build (webpack) related code Configure the directory, including the port number, etc. We can use the default for beginners. Project dependency modules loaded by npm Here is the directory we are going to develop, and basically everything we need to do is in this directory. It contains several directories and files: Assets: place some pictures, such as logo, etc. Components: there is a component file in the directory, but you don’t need it. App.vue: the projectentry file, or we can write the components directly here instead of using the components directory. Main.js: the core file of the project. Index.css: style file. Static resource directory, such as pictures, fonts, etc. Common resource directory. Initial test directory, which can be deleted These are some configuration files, including syntax configuration, git configuration, etc. Home entry file, you can add some meta information or statistical code and so on. Project profile. Project description document in markup format Using? NPM run build? The directory will be generated after the command is packaged. Next, take runoob-vue3-test2 as an example, open the Next, we can try to modify the initialized project by changing Open the page http://localhost:3000/ , which is automatically refreshed aftermodification, and the display effect is as follows:
In recent years, Geographic Information Systems (GIS) have undergone rapid development in both theoretical and practical dimensions. GIS has been widely applied for modeling and decision-making support across various fields such as urban management, regional planning, and environmental remediation, establishing geographic information as a vital component of the information era. The introduction of the “Digital Earth” concept has further accelerated the advancement of GIS, which serves as its technical foundation. Concurrently, scholars have been dedicated to theoretical research in areas like spatial cognition, spatial data uncertainty, and the formalization of spatial relationships. This reflects the dual nature of GIS as both an applied technology and an academic discipline, with the two aspects forming a mutually reinforcing cycle of progress. 
2.5.1. Directory parsing ¶
build config node_modules src static public test .xxxx文件 index.html package.json README.md dist src/APP.vue file, the code is as follows (explained in comments): src/APP.vue file code ¶
src/APP.vue to the following code:
src/APP.vue file code ¶ <template>
<img alt="Vue logo" src="./assets/logo.png" />
<HelloWorld msg="Welcome to the Rookie Tutorial！" />
template>
<script>
import HelloWorld from './components/HelloWorld.vue'
export default {
name: 'App',
components: {
HelloWorld
}
}
script>
Principles, Technologies, and Methods of Geographic Information Systems
102