前言

由于公司需要对接浙政厅的H5应用平台，为了满足平台的发布要求，自己第一次研究Vue项目的搭建。

一、Node的安装？

链接: 官网下载地址.

下载上图中的16.6.1 版本，然后运行.dmg 文件进行安装。安装成功后：在终端运行：node -v 查看node.js是否安装成功

二、Webpack的安装

Ok，接口下来就是通过npm安装webpack了，在终端里输入：

-g 表示全局安装

sudo npm install webpack -g

三、Vue 的安装

sudo npm install -g vue-cli

四、Vue项目的创建

进入终端：cd 创建对应项目的文件夹

运行命令：
vue init webpack 项目名称

命令执行后会出现：

①、Project name (sanfeng1)；输入项目名称（如zlbapp）。（确定按enter，否按N）

②、 Project description (A Vue.js project)；项目描述（一vue.js项目）。（用英文）

③、Author (sunsanfeng)；作者（**）。（确定按enter，否按N）

④、Vue build (Use arrow keys)> Runtime + Compiler: recommended for most usersRuntime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render 　　　　　　　　functions are required elsewhere；Vue公司的建立（使用箭头键）>运行时+编译器：大多数用户推荐运行时间：约6kb轻民+ gzip，但模板（或任何Vue具体HTML）只允许在。VUE文件渲染功能是必需的其他地方。（按enter）

⑤、Install vue-router? (Y/n)；安装的路由？（/ N）。（可安可不安）

⑥、Use ESLint to lint your code? (Y/n)；使用ESlint语法？（Y/ N）。（使用ESLint语法，建议N）

⑦、Setup unit tests with Karma + Mocha? (Y/n)；设置单元测试？（Y / N）。（选N）

⑧、Setup e2e tests with Nightwatch? (Y/n)；Nightwatch建立端到端的测试？（Y / N）。（选N）

五：运行项目

终端：cd 上述的zlbapp 目录
运行：npm run dev (运行可能出现项目错误，这个自己解决)

Mac Webpack Vue项目的搭建相关推荐

【骨架屏】【vue】如何在webpack+vue+vue-cli下搭建多模块/单模块多路由骨架屏
如何在webpack+vue+vue-cli下搭建多模块/单模块多路由骨架屏前言骨架屏的用户感知比loading更好,此前看过很多专栏以及文章,此次实践中还是遇到需要学习的部分. 对于骨架屏或者占 ...
Windows之vue-cli安装和vue项目快速搭建
Windows之vue-cli安装和vue项目快速搭建 1.提前安装好node.js, 安装步骤:https://blog.csdn.net/qq_43842093/article/details/1 ...
Vue项目脚手架搭建
Vue项目脚手架搭建 Vue 项目脚手架搭建需要的工具安装NodeJs 安装vue-cli 安装webpack 初始化项目启动项目 Vue 项目脚手架搭建需要的工具 NodeJs vue-cli ...
「Vue 学习笔记 1」Vue 项目快速搭建，初始项目各个文件夹作用介绍和启动代码执行流程分析
「Vue 学习笔记 1」Vue 项目快速搭建,初始项目各个文件夹作用介绍和启动代码执行流程分析前言一.我的开发环境二.使用 Vue CLI (Vue 脚手架)快速搭建项目三.初始项目的目录结构 ...
vue html引入资源dev下404,webpack vue 项目打包生成的文件,资源文件报404问题的修复方法(总结篇)...
最近在使用webpack + vue做个人娱乐项目时,发现npm run build后,css js img静态资源文件均找不到路径,报404错误...网上查找了一堆解决办法,总结如下一.首先修改c ...
微信/企业微信-本地（MAC）VUE项目调用JS-SDK，开发测试环境搭建
调用微信SDK前置条件根据官方文档,前端在使用微信的接口前要先进行配置,配置信息得从后端获取,后端在计算signature时需要前端传入当前页面的URL,开发者要在公众平台设置JS SDK安全域名, ...
2021-11-11 使用Mac启动vue项目
Mac 安装vscode,并启动vue项目. 下载vscode:(微信传的压缩包),启动后出现微信截图黑屏的情况. 下载node: 下载地址:https://nodejs.org/zh-cn/ nod ...
vue项目ide（vue项目环境搭建）
一.先介绍一下我接下来要做的项目项目:ide可视化工具技术应用: Vue2.0(js框架):Vue.js - 渐进式 JavaScript 框架 | Vue.js ElementUi(饿了吗ui框 ...
vue项目的搭建和常见问题的解决
一.项目搭建 1.安装node环境 node下载地址: https://nodejs.org/en/download/ 上面那个地址经常出现访问不了的情况,如果你碰到了,请访问这个地址:https:/ ...

Mac Webpack Vue项目的搭建

文章目录

前言