VUE中index.html什么時候加載的mainjs呢?


今天突然思考到一個問題,index.html文件中是vue項目的主頁,項目入口,那么mainjs是啥時候被index加載運行的呢?是怎么被運行的呢?

1.先來看看vue項目的一個結構解析(非常感謝磊阿磊阿磊磊磊的圖片)
1.jpg
index.html---主頁,項目入口

App.vue---根組件

main.js---入口文件

2.通過2張圖片搞清楚index和mainjs的關系和配置
1.jpg
1.jpg

很明顯看得出,mainjs中是配置了咱們的頁面該渲染在index中的app節點上的,但是vue項目訪問最開始的文件是index.html,這中間mainjs是如何被indexhtml引用的呢?

3.最后在package.json看到了配置
如果你是用vue.js官網提供的腳手架工具並沿用默認配置的話,
你執行npm run dev的時候會出來頁面,
是因為你根目錄下的package.json文件里script配置了

"dev": "node build/dev-server.js",

也就是其實執行的是dev-server.js這個文件,里面有定義

var webpackConfig = require('./webpack.dev.conf');

因為我們這個腳手架工具里是用webpack來打包項目文件的,依賴的webpack.dev.conf文件里又定義了

var baseWebpackConfig = require('./webpack.base.conf');
在這個依賴webpack.base.conf文件里面entry入口文件就配置了
1.jpg

app: './src/main.js'

所以當你運行npm run dev的時候就從main.js這個入口文件開始執行了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM