基于vue的项目从开发到发布的一些小问题
首页 >  Web前端 > Vue  > 2018年06月17日阅(749)评(0

1、资源引用路径问题

npm run build构建生产包,默认会生成一个dist文件夹,里面包含入口文件index.html的资源文件夹static。

然而现在问题来了,浏览器中打开index.html毫无反应,打开控制台可以看到是默认使用了绝对路径引起的,打开config/index.js文件,将build配置项assetsPublicPath的值改为'./'或者''即可;build的同时还生成了Source Maps,可将productionSourceMap的值设为false以关闭。

QQ截图20180617153146.png

上面虽然解决了index.html中资源路径的引用问题,但是仍然有一些资源文件无法正确引用,比如通过css里引用的图片或字体文件,不难发现默认打包之后css里面对文件的引用变成了如url(static/img/logo.2f00bf2.png)这样,而我们所需的正确引用应该是这样url(../img/logo.2f00bf2.png),那么就需要修改build文件夹下的utils.js代码,如图所示:

QQ截图20180617153410.png

添加如图所示的一行代码,这样不论是字体还是图片的引用问题都能解决。

2、IE报vuex requires a Promise polyfill in this browser问题

这是因为项目中使用了IE不支持的ES6语法,可以使用babel-polyfill(npm i babel-polyfill -S

还需要在build/webpack.base.conf.js文件中进行配置,将原来的:

entry: {
  app: './src/main.js'
}

改为:

entry: {
  app: ['babel-polyfill', './src/main.js']
}

4、使用webpack自定义模块打包

loading...

win10系统找回windows照片查看器
CentOS7安装图形界面GNOME

有朋自远方来...评论一下呗O(∩_∩)O哈哈~

QQ
昵称*
邮箱*
主页