Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令

如何启动项目

Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
以上是之前创建的项目,那么如何启动这个项目呢?
进入到创建的项目里面

Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
执行启动项目的命令

Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
出现以上的情况,那么项目就已经启动了,在浏览器输入就可以了

Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令

vue的项目目录做解释

拿到一个vue的项目,我们首先看的文件是

Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
如果我们在控制台输入
Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
意思就是将我们的项目进行打包,为什么会这样呢,我们执行完 npm run build
项目就会找package.json这个文件
里面有个
Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
那么就找到这个build
其实最后执行的是
node build/build.js

我们的目录里面就有
Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令
就会找到这个,就会进行打包。

打包vue项目

Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令

命令是 npm run build
执行完成之后,我们就可以看到多了这个文件夹
Vue的学习(十四)如何启动vue的项目,并且对vue的项目目录做解释,打包项目的命令