Answer to the question: Where to put the js files in vue scaffolding

The front-end framework Vue.js has become the first choice of many developers. In the Vue.js project, it is very important to use a good scaffolding, which not only saves development time, but also improves the maintainability and scalability of the code. However, in the process of using Vue.js scaffolding, a common question is: where to place the JS files?

The first thing you need to understand is: In the Vue.js project, there are two main types of JavaScript files: Vue components (.vue files) and independent JavaScript files (.js files).

The Vue component is a self-contained unit that contains HTML, CSS, and JavaScript code. Vue.js scaffolding handles components in the form of .vue files, which are composed of templates, scripts, and styles for Vue components. This file is generally located in the src/components folder. Each Vue component folder should contain:

[name].vue

where [name] can be replaced with the name of the component. For example, Header.vue, Footer.vue, etc. Each .vue file should contain the following content:

<template>
  <!-- HTML代码 -->
</template>

<script>
  export default{
    // JavaScript代码
  };
</script>

<style>
  /* CSS代码 */
</style>

In Vue components, DOM manipulation should be avoided as much as possible, and all JavaScript code should be limited to the scope of the current component.

The Vue component defines HTML content through the