2019-03-08Vue-文件结构&启动顺序

2019-03-16  本文已影响0人  技术中的销售

一个典型的Vue项目 结构如下,


Vue项目结构.png

其中主要文件有:
main.js(入口文件,主要作用是初始化vue实例并使用需要的插件).
App.vue(通过模板渲染的方式渲染到main.js中,main.js中的Vue实例装载在Index.html中)
Index.html:页面首页

程序是这样运行起来的:

1 当我们输入命令

当在命令行或powerSell中输入npm run dev, 编译程序(node.js?)就会读取配置文件package.json(根目录下) 中的内容:
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
或者像这样的内容
"dev":"node build/dev-server.js"

2读配置文件

继续读配置文件webpack.dev.conf.js或(dev-server.js)中的内容如:
var baseWebpackConfig = require('./webpack.base.conf')

3 webpack.base.conf

读取内容

module.exports = {
  context: path.resolve(__dirname, '../'),
  entry: {
    app: './src/main.js'
  },

OK,现在,编译器可以启动main.js了。我们的入口文件开始运行了。

上一篇 下一篇

猜你喜欢

热点阅读