Comments (9)
我的配置是有前置脚本的=。=
// 所有js, css 加 hash
fis.match('*.{js,css,less}', {
useHash: true
});
// 所有图片加 hash
fis.match('image', {
useHash: true
});
类似生成以下css:
pack/aio-e2bd84f-ff2f203.css
from fis3-postpackager-loader.
这里后来查了一下,观察生成的aio-xxx.{css,js}
以及__RESOURCE_MAP__
发现,是各有一个文件没有被加入到map.json
里的:
理论上,上图两个框里依次是:
"template:page/investor/profile/mobile/edit/edit.js"
"template:page/investor/profile/mobile/edit/edit.less"
再往上找,这两个文件是会匹配到打包aio-xxx.{css,js}
的:
from fis3-postpackager-loader.
这里延伸出一个问题:
fis3-postpackager-loader只会解析一个页面,而不是所有页面的依赖来生成不同的aio-xxx.{js/css}?
我这边是有一个view.php和一个edit.php文件的,view.php页面打包没问题,访问edit.php有上述问题。
from fis3-postpackager-loader.
大概找出原因了,是因为在pack时设置了以下配置:
allInOne: {
css: 'pack/aio.css',
js: 'pack/aio.js',
},
这里pack.js就取了这个参数,没有区分不同的php文件,默认pkg/${filepath}_aio.{js,css}
有点粗暴
from fis3-postpackager-loader.
附上稍微优雅一点点的配置方法:
allInOne: {
css: 'pack/aio-${hash}.css',
js: 'pack/aio-${hash}.js',
},
看了源代码才知道可以这样玩。
@2betop 可以加到README.md里面,方便后面人参考。
from fis3-postpackager-loader.
@geeyan 我使用${hash}之后, 生成的js 和 css文件的hash值是一样的. 而且我修改css文件后,重新生成的hash值并没有改变, 不知道为什么
edit
看了源码, 生成的hash是根据html文件计算的, 而不是根据pack的所有文件计算的. 有没有什么办法能够根据合并的文件来生成一个hash呢
from fis3-postpackager-loader.
你给 js 和 css 加上 useHash
属性,应该就能在加一段 hash 值
from fis3-postpackager-loader.
from fis3-postpackager-loader.
@treri 我加上${hash},也有部分资源404的情况,你是怎么解决?
from fis3-postpackager-loader.
Related Issues (20)
- 解决了
- [improvement]有没有考虑继续完善一下这个插件,更加智能方便一点? HOT 1
- 为什么升级插件需要全局安装之后libsass的错误又出来了,一直有这个错误? HOT 2
- css加载顺序问题 HOT 1
- <!--RESOURCEMAP_PLACEHOLDER-->定位无效
- Bug
- 混用[es6]import和require会产生两个_aio.js文件 HOT 17
- loader配合domain产生bug
- ignore清单失效 HOT 1
- 对依赖的js文件有顺序要求的,应当如何配置打包?
- css文件合并后的type依然是'js'
- 打包后,个别文件还是没有合并到一起 HOT 4
- 合并打包的js资源,能不能加个属性crossorigin的配置 HOT 1
- 请问aioPkg字段的生成逻辑是怎样的
- 打包忽略文件对css无效 HOT 1
- 与packTo合并js的功能协作问题。 HOT 3
- resourcemapWhitespace配置项缺失 HOT 2
- 设置fis.hook('amd') 依然生成 require.resourceMap()而不是 require.config()?
- 能否提供支持抽离公共js代码功能 HOT 1
- css 没有合并在一起 HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fis3-postpackager-loader.