在使用vue开发项目时,如果要使用其单文件组件特性,必然要使用webpack或者其他打包工具打包,这里我用到的是webpack打包,首先是搭建vue环境和webpack环境,在这里遇到的一个问题是在成功搭建了vue环境之后,webpack环境基本上也搭好了,但是打包的时候,一直没有生成对应的dist文件夹,因为首次打包带的时候用的是npm run dev,所以在文件夹中并没有生成dist文件夹,因为run dev走的是dev-server.js,会启动webpack-dev-server,相应的代码会读进内存,不会在当前目录下产生dist文件夹。

所以首次打包的话想要生成dist文件夹,要使用webpack即可。

vue结合webpack打包问题的更多相关文章

  1. vue和webpack打包 项目相对路径修改

    一般vue使用webpack打包是整个工程的根目录,但是很多情况下都是把vue打包后的文件在某子目录下. 修改: 1,打开index.js assetsPublicPath:'/' 改为: asset ...

  2. vue之webpack打包工具的使用

    vue之webpack打包工具的使用 一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个 ...

  3. vue 使用webpack打包后路径报错以及 alias 的使用

    一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...

  4. vue通过webpack打包后怎么运行

    1. 成功使用webpack打包完成后会默认得到dist的文件夹 2. dist文件夹中有html与其他的静态文件 3. 在dist文件夹中打开命令窗口或者git,开一个服务器(像anywhere) ...

  5. vue项目 webpack打包后,图片路径是绝对路径

    vue项目,使用webpack打包,虽然在全局把路径改成了相对的路径,但是图片引用的路径还是异常的,解决办法如下: 1.config文件夹下index.js中: assetsPublicPath:&q ...

  6. vue的webpack打包

    一个完整的项目离不开 开发环境 生产环境 测试环境 这三个环境 首先解释一下这三个环境的含义 开发环境:开发环境是程序猿们专门用于开发的服务器,配置可以比较随意,为了开发调试方便,一般打开全部错误报告 ...

  7. vue项目webpack打包后修改配置文件

    从webpack打包结构中我们知道,vue中有一个存放外部资源的文件夹static,它里面的文件是不会被打包编译的,所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js ...

  8. 10. vue之webpack打包详解

    一.什么是webpack webpack官网给出的定义是 本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应 ...

  9. vue 之webpack打包工具的使用

    一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个.vue文件中都可能html.js.c ...

随机推荐

  1. gin中HTML渲染

    package main import ( "github.com/gin-gonic/gin" "net/http" ) func login(ctx *gi ...

  2. python 爬虫爬取历年双色球开奖信息

    目前写的这些爬虫都是些静态网页,对于一些高级网页(像经过JS渲染过的页面),目前技术并不能解决,自己也是在慢慢学习过程中,如有错误,欢迎指正: 对面前端知识本人并不懂,过程中如果涉及到前端知识,也是百 ...

  3. StringBuilder类介绍

    1 package cn.itcast.p2.stringbuffer.demo; 2 3 public class StringBuilderDemo { 4 public static void ...

  4. DBeaver下载安装与连接MySQL数据库

    一.Dbeaver下载 官网下载地址:Download | DBeaver Community 点击"Windows 64 bit (installer)"即可进行下载. 二.Db ...

  5. python使用制表符或者换行符来添加空白--3

    #!/usr/bin/python #coding=utf-8 message="python" print(message) print("\tpython" ...

  6. SpringBoot 简单介绍

    一.springboot是啥? 1.什么是springboot? 1.1springboot是spring生态圈的一个轻量级框架,换句话说springboot就是spring,是spring的一个衍生 ...

  7. 读取数据库Blob类型的文本数据

    开发一个查询功能时,遇到了一个ORM的问题:数据库字段是 Blob 类型,里面实际存储的是文本数据,Java 后端代码中用字符串 String 类型去接收这个字段的数据时,报错,提示没有对应的sett ...

  8. 【转】linux shell编程实例总结

    查找当前目录中所有大于500M的文件,把这些文件名写到一个文本文件中,并统计其个数 find ./ -size +500M -type f | tee file_list | wc 在目录/tmp下找 ...

  9. socket在php作用

    PHP 使用Berkley的socket库来创建它的连接.你可以知道socket只不过是一个数据结构.你使用这个socket数据结构去开始一个客户端和服务器之间的会话.这个服务器是一直在监听准备产生一 ...

  10. 深入Java微服务之网关系列1:什么是网关

    ​ 前言 近来,在想着重构一个新的产品.准备采用微服务的技术解决方案,来搭建基础设施框架.网关,是一个必不可少的组件.那么,网关到底是什么? 其又有什么特点或者特性,成为微服务必不可少的组件呢?今天, ...