vue project folders are what (white must-see)

Before that you have installed the program

vue.js scaffolding @ vue / cli taught you how to install configuration

This is not to install any tools for the most basic premise of the course

(There are tools at the bottom of the article Introduction Figure)

here I do not have any tools, the initial interface is such

He began to introduce public

public (translated as public means)

• Information stored inside the main page (single page application)
  • Single Page Application:
  • My project is only a page, when I want to switch content, which are switched in this one page among
  • Like theater, there is the first stage of a program, there is a second program, it is switched person is changing, and that is a stage
• This file is not a last resort do not move this file

He began to introduce src

Additional information:

Development Environment: development

• That is, you write the code environment
• Will retain a lot of information, for example: Exception

Production environment: production

• The code is compiled, the operating environment (the environment placed server runs)

---

src is the development environment

You have to write the code inside the src

Subdirectory :

• assets: static resources.
• components: storage components.
• App.vue: Component (.vue)
  • App.vue content inside
  • template: Template
  • script: logic component configuration information
  • style: style.
• main.js: entry file ⬇⬇⬇

import Vue from 'vue' // 引入VUE核心库

import App from './App.vue'  // 引入一个当前目录下的名字为App.vue的组件

Vue.config.productionTip = false;  // 是否要在生产环境当中给予提示功能。

new Vue({  // 生成一个VUE实例

  render: function (h) { return h(App) },  // 渲染函数,将组件App渲染到挂载的元素上。
  
}).$mount('#app')  //这个 #app 是挂载在 public 主页面上的，你打开index 就会看到 这个元素 id

Here I did not introduce the main page, how he used?
There are introduced, but in webpack which introduced
that is my project, once operational, this main.js I will type into the inside index.html

Since they index.html mounted to the inside, then what you introduced in this document is not able to appear in the main page?

Here is a project run

"" To turn the project ""

Open success screen ⬇⬇⬇

About a diagram from the web page ⬇⬇⬇