①：运行npm run dev 后自动打开浏览器

　　　   首先找到config里面的index.js文件，然后打开找到autoOpenBrowser属性，把默认的false改为true即可

　　　　

　　②：简写路径（比如把 ../src/pages/home/Home 改写为   @/pages/home/Home）

　　　　首先找到build文件夹里面的webpack.base.conf.js文件，

　　　　

　　　　  然后双击打开该文件，找到红色框区域的地方（34行，如果之前没有改过原配置的话）

　　　　 

　　　　　这里的@指代src路径

　　　　   

　　　　　  因为有上面的设置，所以下面引入组件的路径可以由 ../src/pages/home/Home 改写为   @/pages/home/Home（这里的后缀.vue可省略）

　　　　

　　　　    上面是webpack默认的配置，我们也可以自己配置

　　　　

　　　　    设置后，styles就可替代src/assets/styles

　　　　

　　　　 　这时会报错

　　　　

　　　　重新设置webpack配置项以后需要先ctrl+c关闭服务，在npm run dev重启即可

webpack-实用的2个配置的更多相关文章

  1. webpack实用配置

    前面的话 上文介绍了webpack入门,本文将详细介绍webpack实用配置 版本号 以entry.js打包为bundle.js为例,出口的filename可以设置为[id].[name].[hash ...

  2. 规范开发目录 及 webpack多环境打包文件配置

    规范开发目录 普通项目 开发目录: ├── project-name ├── README.md ├── .gitignore ├── assets ├── ├── js ├── ├── css ├─ ...

  3. webpack处理url资源的配置

    webpack处理url资源的配置 1.安装 npm i url-loader -D 2.修改webpack.config.js const path = require('path'); // 启用 ...

  4. webpack 功能大全 【环境配置】

    1. webpack简介 webpack 是一个模块打包工具.它使得模块相互依赖并且可构建等价于这些模块的静态资源.相比于已经存在的模块打包器(module bundler),webpack的开发动机 ...

  5. webpack中typeScript的打包配置

    2018年typescript发展的非常好,js是一门非常灵活的语言,所以一个功能,怎么写都能够写出来,但是这也会导致一个问题,不同人写js的方式不同,那么会导致同一个功能出现的代码风格会迥然不同.这 ...

  6. webpack(2)--webapck自身的配置

    上一记介绍了webpack的安装和基本配置,本记将描述webpack自身的配置 一:指定webpack入口以及出口目录以及输出文件 相信读者在看完上一记后会有一点疑惑:为什么运行webpack要配置s ...

  7. webpack 实用配置总结

    1.webpack.config.js配置文件为: //处理共用.通用的js var webpack = require('webpack'); //处理html模板 var htmlWebpackP ...

  8. webpack实用配置总结

    1.webpack.config.js配置文件为: //处理共用.通用的js var webpack = require('webpack'); //处理html模板 var htmlWebpackP ...

  9. webpack实用小功能介绍

    1.overlay overlay属于devServer的属性,配置案例如下: ? 1 2 3 4 5 6 devServer: {  overlay: {   errors: true,   war ...

  10. webpack构建vue项目（配置篇）

    最近公司要求用vue重构项目,还涉及到模块化开发,于是乎,我专门花了几天的时间研究了一下webpack这个目前来看比较热门的模块加载兼打包工具,发现上手并不是很容易,现将总结的一些有关配置的心得分享出 ...

随机推荐

  1. 安装v2sora@y

    v2r@y安装 1. 安装nginx 这儿使用tengine进行安装, 可以看以前的博客 1.1) 注意带 http_v2 编译 ./configure --with-http_v2_module 不 ...

  2. Oracle - 截取指定日期的alert log

    工作中DBA经常会查看alert log来检查数据库后台都记录了些什么日志,如果只想看某一天或者某段时间范围的日志,能够把这些日志从大的alert log中截取下来放到一个单独的文件中,对于查看和下载 ...

  3. redis安装等其他操作

    重启:./redis-server或者  ./redis-server redis.conf ps -ef|grep redis 得到了进程号 xxxx 然后 ls -l /proc/xxxx/cwd ...

  4. Redis for OPS 07：Redis 补充说明

    写在前面的话 redis 的各种架构搭建暂时就到这里,本文主要用于补充说明 Redis 的一些概念以及配置文件的相关信息. 常用词汇 缓存穿透: 类似热点数据存储 Redis 一样,对于非热点数据存储 ...

  5. MySQL GROUP BY 的问题

    拿 employee 示例数据库为例,当进行如下操作时会报错. mysql> SELECT * FROM employees GROUP BY gender; ERROR 1055 (42000 ...

  6. 关于spring,IOC和AOP的解析原理和举例

    引用自:https://blog.csdn.net/paincupid/article/details/43152397 IOC:就是DAO接口的实现不再是业务逻辑层调用工厂类去获取,而是通过容器(比 ...

  7. grep命令提示"binary file matches **.log"解决方法

    仔细想想,这个问题遇到很多次了,之前一直以为很复杂,一搜索发现解决这么简单,记录一下做备忘. grep test XXX.log Binary file app.log matches 此时使用-a参 ...

  8. Chrome保存的HAR文件怎么打开？

    - Chrome保存HAR 在Chrome中,在需要抓包的任意一个浏览器窗口,按F12,点Network页面,即可进入抓包界面,之后的所有网页交互操作产生的报文,都会在此列出. 在抓包的报文界面上右键 ...

  9. arcgis api for javascript 学习（二） 发布并调用地图切片

    文章将从发布切片地图到调用切片地图整个过程都展示出来. (一).切片地图的发布 1.还是前面的arcgis展示的地图 2.与发布动态地图前面的步骤是一样的 打开分享后,如图 3.一切就绪后,到达缓存的 ...

  10. MySQL事务和锁——《MySQL DBA工作笔记》

    MySQL事务 事务存在的原因 事务存在的目的:保证用户对数据操作对数据是安全的.(比如说银行卡余额) 事务的特性--ACID 原子性:一个事务要么全部执行,要么不执行 一致性:事务开始和结束时,数据 ...