vue创建一个项目

最新推荐文章于 2024-09-18 20:34:46 发布

也是够够的了

最新推荐文章于 2024-09-18 20:34:46 发布

阅读量1.2k

点赞数 1

分类专栏： vue 文章标签： vue.js webpack npm

本文链接：https://blog.csdn.net/weixin_55869175/article/details/123452746

版权

vue 专栏收录该内容

10 篇文章 2 订阅

订阅专栏

本文介绍了如何安装Node.js和使用Vue CLI创建Vue项目。首先，通过Node.js官网或淘宝镜像安装Node.js。接着，使用npm安装Vue CLI并创建名为app的项目，选择所需版本。项目结构包括node_modules、public、src等关键文件夹。完成安装后，运行`npm run serve`启动项目，在浏览器输入`http://localhost:8080/`预览效果。

摘要由CSDN通过智能技术生成

安装node.js

在创建vue以前需要确保安装了node.js。在cmd使用 node -v 查看版本号。
下载地址：https://nodejs.org/zh-cn/
为了后续速度快一点，使用淘宝镜像来安装，

npm install -g @vue/cli --registry=https://registry.npm.taobao.org

安装vue脚手架

安装npm install -g @vue/cli 默认是安装最新的版本
等待片刻，安装成功后在cmd输入vue -V 查看（注意此时是大写的V）
在这里插入图片描述

创建一个vue项目

vue create app创建一个名为app的项目。
在这里插入图片描述
然后选择你所需要的vue版本。按下enter进行安装。成功后你会获得如下目录的文件。

node_modules:放置项目依赖的地方。
public:一般放置一些共用的静态资源，打包上线的时候，public文件夹里面资源原封不动打包到dist文件夹里面。
src：程序员源代码文件夹。
-----assets文件夹：经常放置一些静态资源（图片），assets文件夹里面资源webpack会进行打包为一个模块（js文件夹里面）
-----components文件夹:一般放置非路由组件（或者项目共用的组件）
App.vue 唯一的根组件
main.js 入口文件【程序最先执行的文件】
babel.config.js:babel配置文件
package.json：看到项目描述、项目依赖、项目运行指令
README.md:项目说明文件
vue.config.js文件：需要对外暴露