使用vue脚手架

    xiaoxiao2022-06-26  208

    vue脚手架安装使用步骤

    安装node.js安装全局 vue-cli创建一个基于 webpack 模板的新项目安装模块所需依赖运行项目webstorm设置

    安装node.js

    在官网下载安装就行,在这里就不在叙述

    安装全局 vue-cli

    在 windows 下使用 powershell 来进行安装,先打开 powershell在命令行内键入 npm install --global vue-cli

    创建一个基于 webpack 模板的新项目

    首先 cd 切到项目创建的目录然后在命令行内键入,vue-test 是自定义的项目名称 vue init webpack vue-test 最后设置相关参数

    安装模块所需依赖

    在切入项目文件夹之后,在命令行内键入 npm install 安装完之后的目录结构: build:构建了客户端和服务端,改变端口号等等config:相关配置文件node_model:node 的 model 文件src:项目文件目录(.js、.html 等等你创建的文件)static:相关静态文件.index.html:项目入口文件package.json:配置的依赖README.md:描述了可使用的指令

    运行项目

    在命令行内键入 npm run dev 会给我们打开 8080 端口,访问 localhost:8080 可以看到项目运行的效果: 退出命令提示行,就可以关闭端口

    webstorm设置

    Tab 修改为4个空格 在 .editorconfig 配置文件中,修改 indent_size = 2 为 indent_size = 4

    最新回复(0)