查看“Vue项目搭建”的源代码

== [[Vue环境搭建|'''vue环境搭建''']] ==
== '''vue项目搭建''' ==

=== '''安装webpack''' ===
npm install webpack –g
[[文件:Webpack.png|左|缩略图|642x642像素]]












=== '''安装vue脚手架''' ===
npm install -g @vue/cli
[[文件:@vue-cli.png|左|缩略图|803x803像素]]
















=== 创建vue新项目 ===
在你想要放置的目录下执行Vue create my_text
[[文件:My-text.png|左|缩略图|547x547像素]]







三种配置选择一种回车
[[文件:Enter.png|左|缩略图|643x643像素]]

























=== 启动刚创建的项目 ===
Cd my_test

Npm run serve
[[文件:Run.png|左|缩略图|588x588像素]]























=== 访问项目 ===
访问 <nowiki>http://localhost:8081/</nowiki>
[[文件:Open.png|左|缩略图|467x467像素]]





=== 项目所在位置 ===
[[文件:Position.png|左|缩略图|590x590像素]]









=== 参考资料 ===
Node.js入门：<nowiki>http://www.runoob.com/nodejs/nodejs-tutorial.html</nowiki>

Npm命令：<nowiki>http://www.runoob.com/nodejs/nodejs-npm.html</nowiki>

Vue官网：<nowiki>https://cn.vuejs.org/</nowiki>

Vue CLI：<nowiki>https://cli.vuejs.org/zh/guide/</nowiki>

Es6常用语法：<nowiki>https://blog.csdn.net/itzhongzi/article/details/73330681</nowiki>

Element前端框架 <nowiki>https://element.faas.ele.me/#/zh-CN/component/installation</nowiki>