Vue脚手架工程 - 新建项目时注意事项、与配置工程时经验总结
文章目录
- 新建脚手架工程
- 配置vue.config.js文件
- 启动项目时自启动浏览器
- 编辑演示
- 关闭eslint检验
- 编辑演示
- less语法爆红
- 组件名异常
- 解决方案
- 安装vue-router
- 别忘了注册使用
- 路由path异常
- 解决方案
- vue脚手架加载静态图片
新建脚手架工程
脚手架安装入门-by鬼鬼骑士
配置vue.config.js文件
启动项目时自启动浏览器
devServer: {open: true,host: 'localhost',},
编辑演示
关闭eslint检验
lintOnSave: false,
编辑演示
配置vue.config.js文件
less语法爆红
- 浏览器默认是不识别less语法的,所以要安装lessloader
Vue - 安装less-loader
- vue文件中css样式也是不识别less语法,我们在style标签中写上lang=“less”
组件名异常
解决方案
- 是字符格式问题,取消空格和tabs检测
- 编辑package.json文件
"no-mixed-spaces-and-tabs": 0
安装vue-router
查看vue-router所有版本,因为我们是vue2工程,所以我们用低一点的版本
npm view vue-router versions
安装vue-router3.0
npm install vue-router@3
别忘了注册使用
路由path异常
解决方案
- 引入路由时需要对应的页面识别时才能不报错
- 就这个,只要引入路由,就要有对应的路由页面,哪怕是空的
vue脚手架加载静态图片
<img :src="require('@/img/bg/bg.jpg')" alt="" /> <!-- 成功 -->
Vue脚手架工程 - 新建项目时注意事项、与配置工程时经验总结相关推荐
- Vue 脚手架生成的项目结构分析||Vue 脚手架的自定义配置
Vue 脚手架生成的项目结构分析 Vue 脚手架的自定义配置
- 7004.vue脚手架快速生成项目
文章目录 1 Vue脚手架可以快速生成Vue项目基础的架构. 1.1 安装3.x版本的Vue脚手架: 1.2基于3.x版本的脚手架创建Vue项目: 1.3 分析Vue脚手架生成的项目结构 2 vue脚 ...
- Vue脚手架创建的项目的启动流程
Vue脚手架创建的项目的启动流程 当利用vue脚手架创建项目之后利用 npm run serve 启动开发环境,我们就从这里来开始分析. 入口分析 首先从package.json中的脚本配置来看,np ...
- Vue 脚手架CLI 初始化项目
1 介绍 CLI是Command-Line Interface,翻译为命令行界面,但是俗称脚手架. Vue CLI是一个官方发布vue.js项目脚手架 使用vue-cli可以快速搭建vue开发环境以及 ...
- Vue脚手架安装及项目搭建(mac版)
前提:电脑上已经安装好了npm vue脚手架全局安装终端命令 $ sudo npm install -g vue-cli 安装完成之后检测 $ vue -V 如果终端输出vue的版本号,那么脚手架就安 ...
- vue脚手架项目如何加入html文件,使用vue脚手架怎么搭建项目
使用vue脚手架搭建项目的方法:1.全局安装vue-cli脚手架:2.打开命令提示符,通过cd命令进入项目所在文件夹:3.创建vue-cli工程项目:4.安装依赖:5.启动项目. 本教程操作环境:wi ...
- Vue脚手架创建TS项目
What is TS? TS语言,也就是TypeScript,是前端一个非常强大的语言超集,基于JavaScript. TS的强大吸引了许许多多的前端开发者学习使用. TS最大的特点,就是在JavaS ...
- 在手机上查看和测试vue脚手架搭建的项目
① 打开cmd输入命令ipconfig,获取到本机的IP地址: ② 得到IPV4值,然后用该值替换localhost: ③ 找到vue项目的config文件夹下的index.js文件,打开后将h ...
- vue脚手架做的项目如何放在服务端,vue项目部署到服务器
在项目目录下(如:e:\workspace\taobao)运行 npm run build即可,完成后,就会在项目目录下有多一个dist目录,把dist下的内容就可以放在web服务器上了. 哈哈,完了 ...
最新文章
- 为什么我的python程序编译器没有行代号_为什么我的python字典没有附加新变量呢?...
- python 多线程及线程间通信
- 烂泥:vcenter5.5无AD下的安装与配置
- 基于keepalived对redis做高可用配置---转载
- 基于Spring+SpringMVC+Mybatis的分布式敏捷开发系统架构(附源码)
- flutter制作具有自定义导航栏的渐进式 Web 应用程序
- [文摘]上软解散相关
- Jenkins主从节点配置
- java文字旋转90度_菜鸟求助:在 JAVA APPLET 里如何旋转 90 度显示一个字符?
- 快速安装Docker图形化管理平台ShipYard
- android分析之Binder 01
- ubuntu-16.04安装程序报错 you might want to run 'apt-get -f install' to correct these
- php mysql zend linux,Linux系统安装配置PHP+MySQL+zend+PHPadmin开发环境
- Rust 智能指针(二)
- amd cpu排行_amd cpu性能排行图_笔记本CPU性能排行天梯图-2012最新笔记本CPU天梯图...
- 什么是软件EV代码签名证书
- 用matplotlib高仿同花顺的K线,成交量,MACD,KDJ(一)
- 虎扯:《小苹果》为什么那么火
- 从前端出发做好SEO需要考虑什么
- 五、Springboot 整合Shiro---03认证---第三方QQ登陆
热门文章
- 打字练习软件——JavaFx
- 华为FusionCompute之个人学习环境虚拟化嵌套部署方案
- [Element]给项目中所有的dialog添加打开关闭监听
- python3读写excel,计算学分绩
- 劉國增(河南原陽): 幻方新品種--胞胎幻方(中)
- python语法(三)字符串
- 新版firefox中没有firebug了
- ThreadPoolExecutor不抛异常
- CountDown原理及使用
- Ensemble Learning常见方法总结(Bagging、Boosting、Stacking、Blending)