为什么VUE默认加载main.js文件,为什么main.js是Vue工程的入口文件
📅 2026/7/28 11:52:19
👁️ 阅读次数
📝 编程学习
VUE是如何默认加载main.js文件
vue中的挂载页面index.html路径是在webpack.dev.conf.js下配置的,
找到plugins下面的
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true
}),
以上便是挂载页面的配置,其中
filename是输出的文件名,默认是index.html
template是依赖的模板,修改这个就能改变挂载的模板路径
在工程文件中使用main.js来加载App.vue文件,但没有代码写出来加载main.js,而index.html中只有一个自定义标签app,那么工程是如何加载到main.js文件的呢?
如果你是用vue.js官网提供的脚手架工具并沿用默认配置的话,你执行npm run dev的时候会出来页面,是因为你根目录下的package.json文件里script配置了"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",也就是其实执行的是webpack.dev.conf.js这个文件,依赖的webpack.dev.conf文件里又定义了const baseWebpackConfig = require('./webpack.base.conf');在这个依赖webpack.base.conf文件里面entry入口文件就配置了app: './src/main.js',所以当你运行npm run dev的时候就从main.js这个入口文件开始执行了
编程学习
技术分享
实战经验