介绍
小编给大家分享一下vue-cli中项目结构的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获、下面让我们一起去了解一下吧!
<强>总体框架
一个vue-cli的项目结构如下,其中src文件夹是需要掌握的,所以本文也重点讲解其中的文件,至于其他相关文件,了解一下即可。
<强>文件结构细分
<强> 1.构建——[webpack配置)
构建文件主要是webpack的配置,主要启动文件是dev-server。js,当我们输入npm运行dev首先启动的就是dev-server。js,它会去检查节点及npm版本,加载配置文件,启动服务。
& lt; style>
import & # 39;才能。/资产/css/public.css& # 39;
& lt;/style>
这样,我们就可以把风格下的样式封装起来,写到css文件夹,再引入到页面使用,整个vue页面也看上去更简洁。
<强> 4.3 main.js——[入口文件)
main.js主要是引入vue框架,根组件及路由设置,并且定义vue实例,下图中的
组件:{应用}就是引入的根组件应用。vue
后期还可以引入插件,当然首先得安装插件。
