Vue脚手架创建项目
创建一个基于webpack模板的新项目
D:\Git
$ vue -V
2.9. D:\Git
$ vue init webpack my-project ? Project name my-project
? Project description A Vue.js project
? Author hongda <hongda159505@qq.com>
? Vue build (Use arrow keys)
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recommended) npm vue-cli · Generated "my-project". # Installing project dependencies ...
# ======================== npm WARN deprecated socks@1.1.: If using .x branch, please upgrade to at least 2.1. to avoid a serious bug with socket data flow and an import issue introduced in 2.1. > chromedriver@2.38. install D:\Git\my-project\node_modules\chromedriver
> node install.js Downloading https://chromedriver.storage.googleapis.com/2.38/chromedriver_win32.zip
Saving to C:\Users\qhong\AppData\Local\Temp\chromedriver\chromedriver_win32.zip
Received 782K...
Received 1568K...
Received 2352K...
Received 3136K...
Received 3299K total.
Extracting zip contents
Copying to target path D:\Git\my-project\node_modules\chromedriver\lib\chromedriver
Done. ChromeDriver binary available at D:\Git\my-project\node_modules\chromedriver\lib\chromedriver\chromedriver.exe > uglifyjs-webpack-plugin@0.4. postinstall D:\Git\my-project\node_modules\webpack\node_modules\uglifyjs-webpack-plugin > node lib/post_install.js npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2. (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) added packages in .032s Running eslint --fix to comply with chosen preset rules...
# ======================== > my-project@1.0. lint D:\Git\my-project
> eslint --ext .js,.vue src test/unit test/e2e/specs "--fix" # Project initialization finished!
# ======================== To get started: cd my-project
npm run dev Documentation can be found at https://vuejs-templates.github.io/webpack
需要注意的是项目的名称不能大写,不然会报错。
Project name (my-project) # 项目名称(我的项目)
Project description (A Vue.js project) # 项目描述一个Vue.js 项目
Author 作者(你的名字)
Install vue-router? (Y/n) # 是否安装Vue路由,也就是以后是spa(但页面应用需要的模块)
Use ESLint to lint your code? (Y/n) # 使用 ESLint 到你的代码? (Y [ yes ] / N [ no ])
Pick an ESLint preset (Use arrow keys) # 选择一个预置ESLint(使用箭头键)
Setup unit tests with Karma + Mocha? (Y/n) # 设置单元测Karma + Mocha? (Y/ N)
Setup e2e tests with Nightwatch? (Y/n) # 设置端到端测试,Nightwatch? (Y/ N)
当然这些都看你自己个人的情况,我这里是全选了是。
各目录用途:

安装项目所需要的依赖
npm install
运行:
$ npm run dev > my-project@1.0. dev D:\Git\my-project
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js % emitting DONE Compiled successfully in 4030ms :: I Your application is running here: http://localhost:8080
提示已运行在8080端口
修改运行时自动打开浏览器:
目录中config下的index.js修改,将autoOpenBrowser:false 改为true
意思是是否默认打开浏览器改为是。就好了

https://segmentfault.com/a/1190000011275993
https://www.jianshu.com/p/1626b8643676
Vue脚手架创建项目的更多相关文章
- 小白6步搞定vue脚手架创建项目
1.安装node及npm node -v (测试node是否安装成功)npm -v(测试npm是否安装成功) 2.安装cnpm npm install -g cnpm --registry=http: ...
- Vue脚手架创建项目出现 (Failed to download repo vuejs-templates/webpack: Response code 404)
搭建好(脚手架2.X版本)环境像往常一样使用vue init webpack xxxx 创建项目可以是没多久就开始报错了 报错结果就是:vue-cli · Failed to download rep ...
- vue脚手架创建项目后使用路由报错Object(...) is not a function问题
在这之前我做过的vue项目没有这种问题,今天突然出现这个问题,也检查了很久的代码,最后解决我也不知道我是哪一步做错了 首先我是创建的vue2项目,基本操作跟平常一样,在运用路由跳转的时候遇到这个问题 ...
- vue脚手架创建项目名字报错
vue inti webpack TimeManger 报错 Sorry, name can no longer contain capital letters 原来这个capital是大写的意思,上 ...
- vue脚手架创建项目及常用配置
首先安装配置这两篇挺好的 https://www.cnblogs.com/lgx5/p/10732016.html https://blog.csdn.net/qiang510939237/artic ...
- 用vue脚手架创建bootstrap-vue项目
用vue脚手架创建bootstrap-vue项目 框架的地址:https://bootstrap-vue.js.org/docs/ 第一步 vue init webpack demo第二步 cd de ...
- Vue.js用脚手架创建项目
安装全局脚手架 cnpm install vue-cli -g vue --version 用脚手架创建项目 创建项目 运行项目 停止项目:Ctrl+C 修改端口 config - index.js ...
- Vue脚手架搭建项目
全局安装vue脚手架 $ npm install -g vue-cli 卸载方法 $ npm uninstall -g vue-cli 查看vue版本(注意:大写的V) $ vue -V 创建项目 $ ...
- redis列表,字典,管道,vue安装,创建项目
redis mysql,redis,mogondb 1.mysql,oracle:关系型数据库,有表概念 2.redis,mongodb/nosql:非关系型数据库 没有表概念 mongodb存储在硬 ...
随机推荐
- Oracle TNS-01190: The user is not authorized to execute the requested listener command
今天,在玩 lsnrctl命令,是为了了解Oracle的一些配置. 当执行 show inbound_connect_timeout 命令之后,提示了错误信息: TNS-01190: The user ...
- [ Learning ] Spring Resources
1. Spring MVC Spring MVC原理及配置详解 springMVC系列之(三) spring+springMVC集成(annotation方式) Mybatis3+Spring4+Sp ...
- Beta冲刺阶段5.0
1. 提供当天站立式会议照片一张 2. 每个人的工作 (有work item 的ID) 成员 昨天已完成的工作 今天计划完成的工作 工作中遇到的困难 具体贡献 郑晓丽 首页活动详情界面的美化 实现首页 ...
- redis 知识点
默认端口 6379 单个value 最大可以保存1G 默认RDB(异步刷盘方式) 禁用持久化修改redis.conf,找到save配置,改为save "" 即可 1. 特点 Re ...
- MQTT 发布者订阅者
添加依赖: <dependency> <groupId>org.eclipse.paho</groupId> <artifactId>org.eclip ...
- PYQT5学习笔记之各模块介绍
Qtwidgets模块包含创造经典桌面风格的用户界面提供了一套UI元素的类 Qtwidegts下还有以下常用对象,所以一般使用Qtwidegts时会使用面向对象式编程 QApplication: ap ...
- c# 使用checked和unchecked
首先要知道int型在c#中是一个32位的数.由此可以知道int型的取值范围是(-2147483648~2147483647)当要使用int的最小值或者是最大值的时候,可以使用int.MinValue和 ...
- android使用ARouter跳转activity(阿里巴巴开源的)
android使用ARouter跳转activity(阿里巴巴开源的) 使用ARouter方式,点击按钮跳转到其他activitypublic void buyOrSell(String str){ ...
- gitlab提交内容关联到slack通知
gitlab提交内容关联到slack通知 https://docs.gitlab.com/ee/user/project/integrations/slack.html 首先去slack做相关的设置 ...
- Android Auto开发初探
一.Android Auto 概述 二.Android Auto 使用方法 四.Android Auto应用开发 五.Android Auto开发总结 一.Android Auto 概述 最近物联网是 ...
