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. 利用PIE实现全球云分布图的效果

    1.问题背景: 最近项目中获得了一份全球云分布图,客户要求把云显示在全球地图上,出现云的效果,如下图所示: [全球云分布图] [世界地图云示意图] 2.解决思路 咨询专业的业务人员,建议我测试下试试地 ...

  2. MvcForum中文版+PostgreSql源码下载

    演示地址:http://bbs.hfenxiao.com 因为种处原因在家休假,闲来无事,便将去年关注的一个基于asp.net mvc论坛程序拿出来做了一些调整. 据说PostgreSql是世界上功能 ...

  3. 远景GIS云产品规划

    远景GIS云平台在初期有过产品设计,随着研发工作的进行以及对GIS云的认知更进行一步,最近重新梳理了平台的产品规划,使以后的开发不至于走偏方向. GIS云平台的研发也是摸着石头过河,免不了有考虑不到的 ...

  4. 注解@Slf4j

    介绍 常见的Slf4j日志打印有两种方式,分别为传统方式和注解方式. 1.传统方式 示例: package com.example.demo.controller; import org.slf4j. ...

  5. 使用Netty3或Netty4发布Http协议服务

    现在是2018年1月11日18:12分,已经是下班时间了,小Alan今天给大家简单的介绍一下Netty,让大家以后在使用到Netty的时候能够有一定的了解和基础,这样深入学习Netty以及以后灵活应用 ...

  6. ubuntu16下面 redis 无法链接到客户端问题

    1.今天从github上面下载了一个项目,链接到自己的tomcat里面的redis,结果在虚拟机里面可以链接成功,但是在客户端总是提示链接失败.google之后,原来是 因为 需要在redis里面设置 ...

  7. 简说MVC Filter

    Filter与FilterProvider之间的关系 根据用途和执行时机的不同,MVC主要分为以下5种类型的过虑器:AuthenticationFilter.AuthorizationFilter.A ...

  8. Oracle 检查表的数据变动

    本知识点仅适用于Oracle 9i以上的版本. 查看表的数据变动情况请使用SQL语句:select * from user_tab_modifications; user_tab_modificati ...

  9. 计算机应用基础PPT flash作业

  10. Java实例---flappy-bird实例[最终版]

    代码分析 解析版: Java实例---flappy-bird实例解析 完整版: TestBirdFly.java package testfly; import java.awt.Color; imp ...