1,按照官网安装步骤install

$ npm install -g vue-cli
$ vue init webpack my-project
$ cd my-project
$ npm install
$ npm run dev

2,生产部署(npm run build)时会遇到静态文件路径问题

解决如下:

3,背景图片引用地址问题

上面虽然解决了资源路径的引用问题,但是资源里面的背景图片,不像index.html中加载资源一样,通过./static/js/app.js引用可以正常加载,图片资源是通过css加载的,如 background: url("../../assets/images/logo-index.png") no-repeat;被相对打包后变成了url(static/img/logo-index.2f00bf2.png) no-repeat所以我们要保留css引用图片的正常路径,如下:

新增:publicPath:'../../'

3,使用element-ui、mint-ui时的注意

1,修改.babelrc文件后,出现Couldn't find preset "es2015" relative to directory问题错误

解决:npm install babel-preset-es2015 -S

文章摘选:https://www.cnblogs.com/moqiutao/p/7496718.html

webpack+vuecli问题记录

webpack+vuecli使用问题总结的更多相关文章

  1. webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用

    资源相对引用路径 问题描述 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的. 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static ...

  2. [Vuejs] webpack+vue-cli打包如何引用相对路径

    默认情况下通过webpack+vuec-li打包的css.js等资源,路径都是绝对的,即static在根目录下,假如部署到带有文件夹目录的项目中,资源路径就会出错,如何解决. 1.修改资源引用相对路径 ...

  3. webpack+vuecli打包常见的2个坑

    第一个坑: 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的.但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径 ...

  4. webpack vue-cli 一有空格和分号就报错

    webpack vue-cli 一有空格和分号就报错 eslintrc.js 这是ESLint的配置文件,至于为什么用ESLint的话,就是为了自动检查代码,保持一致的代码风格,从而保证代码质量. 这 ...

  5. vue之webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用

    问题描述 一般情况下,通过webpack+vue-cli默认打包的css.js等资源,路径都是绝对的 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径 ...

  6. [整理] webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用

    webpack+vuecli打包生成资源相对引用路径与背景图片的正确引用 https://www.cnblogs.com/moqiutao/p/7496718.html

  7. webpack + vuecli多页面打包基于(vue-template-admin)修改

    转: webpack + vuecli多页面打包基于(vue-template-admin)修改 遇见的问题TypeError: Cannot read property 'tap' of undef ...

  8. 从零开始系列之vue全家桶(1)安装前期准备nodejs+cnpm+webpack+vue-cli+vue-router

    写在前面: 什么是全家桶? 包含了vue-router(http://router.vuejs.org),vuex(http://vuex.vuejs.org), vue-resource(https ...

  9. node+webpack+vue-cli

     安装nodejs + 安装webpack + 安装vue-cli+安装脚手架模板+安装依赖+运行 1 安装nodejs 去官网安装node.js( http://www.runoob.com/nod ...

随机推荐

  1. System Monitor ArcGIS系统监控利器

    System Monitor是Esri推出的GIS系统监控工具,对于GIS数据中心的运维人员是难得的利器.早期版本是开源免费的解决方案,在今年的Esri 全球用户大会上,Esri宣布将发行商业版的Sy ...

  2. APM飞控系统详细介绍

    APM飞控系统详细介绍2013-04-05 12:28:24   来源:   评论:2 点击:10303 APM飞控系统是国外的一个开源飞控系统,能够支持固定翼,直升机,3轴,4轴,6轴飞行器.在此我 ...

  3. Android深入四大组件(六)Service的启动过程

    前言 此前我用较长的篇幅来介绍Android应用程序的启动过程(根Activity的启动过程),这一篇我们接着来分析Service的启动过程.建议阅读此篇文章前,请先阅读Android深入四大组件(一 ...

  4. python数据处理与机器学习

    提纲 numpy: #genformtxt import numpy as np #genformtxtdata=np.genfromtxt("genfromtxtdata") # ...

  5. 初始HTML

    了解HTML 1.1       HTML的作用 HTML就是用来制作网页 1.2       什么是HTML HTML是英文HyperText Markup Language的首字母缩写,即超文本标 ...

  6. django1.8 增加注册用户其他字段(用户扩展)

    在V1.6及之后版本已经删除get_profile()方法,需要使用userprofile. 1.新建moduel,名为UserProfile: class UserProfile(models.Mo ...

  7. 监控事件日志关键字规则(EventDescription)

    新建规则--基于NT事件日志--自定义条件:EventDescription - 包含 - 关键字

  8. Nginx 0.8.x + PHP 5.2.13(FastCGI)搭建胜过Apache十倍的Web服务器(第6版)

    前言:本文是我撰写的关于搭建“Nginx + PHP(FastCGI)”Web服务器的第6篇文章.本系列文章作为国内最早详细介绍 Nginx + PHP 安装.配置.使用的资料之一,为推动 Nginx ...

  9. Mybatis学习---Mybatis分页插件 - PageHelper

    1. Mybatis分页插件 - PageHelper说明 如果你也在用Mybatis,建议尝试该分页插件,这个一定是最方便使用的分页插件. 该插件目前支持Oracle,Mysql,MariaDB,S ...

  10. Office Online Server 2016 部署和配置

    Office Online Server 2016 部署和配置https://wenku.baidu.com/view/65faf8de846a561252d380eb6294dd88d1d23d45 ...