Vue学习：14.工程化开发&脚手架

0基础如何进入IT行业？

简介：对于没有任何相关背景知识的人来说，如何才能成功进入IT行业？是否有一些特定的方法或技巧可以帮助他们实现这一目标？
方向一：学习路径

1.明确兴趣和目标：首先确定你对IT领域的兴趣和目标。IT行业非常广泛，包含了软件开发、网络管理、数据分析、人工智能等不同的领域。了解自己的兴趣和目标，可以帮助你选择适合的学习路径。

2.学习编程基础：无论你选择哪个领域，学习编程是一个重要的起点。掌握一门编程语言（如Python、JavaScript、Java等）和基本的编程概念（如变量、循环、函数等）是必要的。可以通过在线教程、编程学习平台、书籍等方式学习编程基础知识。

3.选择专业领域：根据自己的兴趣和目标选择IT领域中的一个专业方向，例如前端开发、后端开发、数据分析、网络安全等。针对选定的方向，深入学习相关的技术和知识，并进行实际项目练习。

方向二：技能培养

1.参加培训课程或学位课程：如果你想获得更系统化的学习经验，可以考虑参加IT培训班或报读相关的学位课程。这些课程通常会提供更深入的知识和实践机会，并且可以获得认可的证书或学位，有助于增加就业竞争力。

2.做项目和实践：在学习过程中，尽量多做一些项目和实践练习，以实际应用所学知识。可以参与开源项目、自己构建小型应用程序或者参加一些编程比赛，这样可以展示你的技能并积累宝贵的经验。

3.建立专业网络：参加一些IT行业的活动、交流会议或者加入相关的社群，与从业者建立联系，并从他们那里获取指导和支持。与其他人分享你的学习和项目经验，也可以帮助你扩展专业网络。

4.持续学习和跟进技术发展：IT行业发展迅速，新技术和工具层出不穷。要保持竞争力，需要持续学习和跟进最新的技术趋势。关注行业动态、阅读技术文章、参加在线课程或研讨会，都是不断学习的好方法。

方向三：实践经验

多敲代码！！！

CLI 

Vue工程化开发是指使用一系列工具、框架和最佳实践来组织、管理和构建Vue.js项目的过程。它旨在提高开发效率、优化项目结构、提升代码质量，并简化部署和维护流程。

在软件开发过程中，脚手架（scaffold）是一种自动化工具，用于快速生成项目的基础结构、配置文件和代码模板，以减少开发者在项目初始化阶段的重复工作，并提供最佳实践的默认设置。

在Vue.js开发中，Vue CLI（Vue Command Line Interface）就是一个常用的脚手架工具。Vue CLI可以帮助开发者快速搭建Vue.js项目的基础结构，并集成了一系列开发工具和最佳实践，例如开发服务器、热重载、代码分割、ESLint等，使得项目初始化和配置变得更加简单。

使用Vue CLI创建项目时，它会自动生成一个包含了基本目录结构、配置文件和示例代码的项目模板，开发者可以在此基础上进行开发，而无需从零开始搭建项目结构。

安装：

可以通过npm或者yarn来进行安装。

npm install -g @vue/cli
# or
yarn global add @vue/cli

安装之后，你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。

你还可以用这个命令来检查其版本是否正确：

vue --version

创建项目：

使用Vue CLI创建一个新的Vue.js项目。在命令行中执行以下命令：

vue create my-project

注意：项目名不要出现中文！！

启动项目：

cd my-project
npm run serve
# or
cd my-project
yarn serve

这将启动一个开发服务器，你可以在浏览器中访问你的项目。默认情况下，服务器运行在 http://localhost:8080。

 各文件作用：

 

1. node_modules： 存放项目依赖的第三方库和模块，使用npm或Yarn安装的依赖都会被存放在这个文件夹中。

2. public： 存放公共资源文件，这些文件会被直接复制到构建输出目录（dist目录）中，不经过webpack的处理。

3. src： 存放源代码文件，是开发者主要进行开发的目录。

   • assets： 存放静态资源文件，如图片、字体等。

   • components： 存放Vue组件文件，可复用的UI组件和业务组件通常放在这个目录中。

   • views： 存放页面组件文件，每个页面对应一个.vue文件，通常用于路由配置中。

   • App.vue： 应用的根组件，所有其他组件都将在这个组件下进行渲染。

   • main.js： 应用的入口文件，主要用于初始化Vue实例、引入全局依赖和挂载根组件等操作。

4. babel.config.js： Babel配置文件，用于配置Babel转译器的参数和插件。

5. package.json： npm项目配置文件，包含了项目的依赖信息、脚本命令、版本号等。

6. package-lock.json（或yarn.lock）： npm或Yarn的锁文件，用于确保项目在不同环境中安装的依赖版本一致。

7. README.md： 项目的说明文档，通常包含了项目的介绍、使用方法、贡献指南等信息。

8. vue.config.js： Vue CLI的配置文件，用于配置webpack和其他构建工具的行为，比如自定义webpack配置、配置代理等。