draft: refactor project so it sits on top of a standalone app
This commit is contained in:
+5
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"presets": [
|
||||
["env", { "modules": false }]
|
||||
]
|
||||
}
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
extends: ['plugin:vue-libs/recommended']
|
||||
}
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
<!--
|
||||
IMPORTANT: Please use the following link to create a new issue:
|
||||
|
||||
https://new-issue.vuejs.org/?repo=vuejs/vue-loader
|
||||
|
||||
If your issue was not created using the app above, it will be closed immediately.
|
||||
-->
|
||||
+586
@@ -0,0 +1,586 @@
|
||||
<a name="15.9.1"></a>
|
||||
## [15.9.1](https://github.com/vuejs/vue-loader/compare/v15.9.0...v15.9.1) (2020-03-19)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ensure unique `ident` when cloning rules, fix webpack 5 compatibility ([#1653](https://github.com/vuejs/vue-loader/issues/1653)) ([84c34a4](https://github.com/vuejs/vue-loader/commit/84c34a4))
|
||||
|
||||
|
||||
|
||||
<a name="15.9.0"></a>
|
||||
# [15.9.0](https://github.com/vuejs/vue-loader/compare/v15.8.3...v15.9.0) (2020-02-12)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* add vue-template-compiler as an optional peer dependency ([56db1d7](https://github.com/vuejs/vue-loader/commit/56db1d7)), closes [#1639](https://github.com/vuejs/vue-loader/issues/1639)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* support Rule.rules (nested rules) ([#1618](https://github.com/vuejs/vue-loader/issues/1618)) ([5943319](https://github.com/vuejs/vue-loader/commit/5943319))
|
||||
|
||||
|
||||
|
||||
<a name="15.8.3"></a>
|
||||
## [15.8.3](https://github.com/vuejs/vue-loader/compare/v15.8.2...v15.8.3) (2019-12-16)
|
||||
|
||||
|
||||
|
||||
<a name="15.8.2"></a>
|
||||
## [15.8.2](https://github.com/vuejs/vue-loader/compare/v15.8.1...v15.8.2) (2019-12-16)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* fix compatibility with webpack 3 ([745d054](https://github.com/vuejs/vue-loader/commit/745d054))
|
||||
|
||||
|
||||
|
||||
<a name="15.8.0"></a>
|
||||
# [15.8.0](https://github.com/vuejs/vue-loader/compare/v15.7.2...v15.8.0) (2019-12-16)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **types:** should import type definition from the `dist` folder ([0751213](https://github.com/vuejs/vue-loader/commit/0751213))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* add support for webpack5 ([#1613](https://github.com/vuejs/vue-loader/issues/1613)) ([59eebca](https://github.com/vuejs/vue-loader/commit/59eebca))
|
||||
|
||||
|
||||
|
||||
<a name="15.7.2"></a>
|
||||
## [15.7.2](https://github.com/vuejs/vue-loader/compare/v15.7.1...v15.7.2) (2019-11-02)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* add cache-loader to optional peer dependency ([e9d8b71](https://github.com/vuejs/vue-loader/commit/e9d8b71))
|
||||
* use `require.resolve` when referencing `cache-loader` ([#1585](https://github.com/vuejs/vue-loader/issues/1585)) ([d3fa467](https://github.com/vuejs/vue-loader/commit/d3fa467))
|
||||
|
||||
|
||||
|
||||
<a name="15.7.1"></a>
|
||||
## [15.7.1](https://github.com/vuejs/vue-loader/compare/v15.7.0...v15.7.1) (2019-07-18)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* use "api.isRecorded" instead of "module.hot.data" ([#1569](https://github.com/vuejs/vue-loader/issues/1569)) ([6a05115](https://github.com/vuejs/vue-loader/commit/6a05115))
|
||||
|
||||
|
||||
|
||||
<a name="15.7.0"></a>
|
||||
# [15.7.0](https://github.com/vuejs/vue-loader/compare/v15.6.4...v15.7.0) (2019-02-28)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* support post loaders for template blocks ([#1500](https://github.com/vuejs/vue-loader/issues/1500)) ([731a7ad](https://github.com/vuejs/vue-loader/commit/731a7ad))
|
||||
|
||||
|
||||
|
||||
<a name="15.6.4"></a>
|
||||
## [15.6.4](https://github.com/vuejs/vue-loader/compare/v15.6.0...v15.6.4) (2019-02-19)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **templateLoder:** honor options.productionMode ([#1409](https://github.com/vuejs/vue-loader/issues/1409)) ([01990d0](https://github.com/vuejs/vue-loader/commit/01990d0))
|
||||
* avoid generating custom block when there is only cache-loader ([#1493](https://github.com/vuejs/vue-loader/issues/1493)) ([a1af343](https://github.com/vuejs/vue-loader/commit/a1af343))
|
||||
* fix wrong outputSourceRange usage ([#1482](https://github.com/vuejs/vue-loader/issues/1482)) ([2d96215](https://github.com/vuejs/vue-loader/commit/2d96215))
|
||||
* keep style index consistent when filtering styles ([#1496](https://github.com/vuejs/vue-loader/issues/1496)) ([e02d937](https://github.com/vuejs/vue-loader/commit/e02d937))
|
||||
* relay correct error message on vue-template-compiler version mismatch ([fdd0338](https://github.com/vuejs/vue-loader/commit/fdd0338))
|
||||
|
||||
|
||||
|
||||
<a name="15.6.3"></a>
|
||||
## [15.6.3](https://github.com/vuejs/vue-loader/compare/v15.6.2...v15.6.3) (2019-02-18)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* **templateLoder:** honor options.productionMode ([#1409](https://github.com/vuejs/vue-loader/issues/1409)) ([01990d0](https://github.com/vuejs/vue-loader/commit/01990d0))
|
||||
* avoid generating custom block when there is only cache-loader ([#1493](https://github.com/vuejs/vue-loader/issues/1493)) ([a1af343](https://github.com/vuejs/vue-loader/commit/a1af343))
|
||||
|
||||
|
||||
|
||||
<a name="15.6.2"></a>
|
||||
## [15.6.2](https://github.com/vuejs/vue-loader/compare/v15.6.1...v15.6.2) (2019-01-27)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* fix wrong outputSourceRange usage ([#1482](https://github.com/vuejs/vue-loader/issues/1482)) ([2d96215](https://github.com/vuejs/vue-loader/commit/2d96215))
|
||||
|
||||
|
||||
|
||||
<a name="15.6.1"></a>
|
||||
## [15.6.1](https://github.com/vuejs/vue-loader/compare/v15.6.0...v15.6.1) (2019-01-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* relay correct error message on vue-template-compiler version mismatch ([fdd0338](https://github.com/vuejs/vue-loader/commit/fdd0338))
|
||||
|
||||
|
||||
|
||||
<a name="15.6.0"></a>
|
||||
# [15.6.0](https://github.com/vuejs/vue-loader/compare/v15.5.1...v15.6.0) (2019-01-23)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* template comments replace windows \ to / confirm consistent hash ([#1477](https://github.com/vuejs/vue-loader/issues/1477)) ([adc6dd6](https://github.com/vuejs/vue-loader/commit/adc6dd6))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* make `__file` injection opt-in in production ([#1475](https://github.com/vuejs/vue-loader/issues/1475)) ([001382d](https://github.com/vuejs/vue-loader/commit/001382d))
|
||||
* support for compiler 2.6 outputSourceRange ([2215585](https://github.com/vuejs/vue-loader/commit/2215585))
|
||||
* support webpack 5 hooks ([#1469](https://github.com/vuejs/vue-loader/issues/1469)) ([7275ae4](https://github.com/vuejs/vue-loader/commit/7275ae4))
|
||||
|
||||
|
||||
|
||||
<a name="15.5.1"></a>
|
||||
## [15.5.1](https://github.com/vuejs/vue-loader/compare/v15.5.0...v15.5.1) (2019-01-08)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* avoid to generate empty css chunk files ([#1464](https://github.com/vuejs/vue-loader/issues/1464)) ([c444ab6](https://github.com/vuejs/vue-loader/commit/c444ab6))
|
||||
|
||||
|
||||
|
||||
<a name="15.5.0"></a>
|
||||
# [15.5.0](https://github.com/vuejs/vue-loader/compare/v15.4.0...v15.5.0) (2019-01-04)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* css modules extends error ([#1452](https://github.com/vuejs/vue-loader/issues/1452)) ([082c6ea](https://github.com/vuejs/vue-loader/commit/082c6ea)), closes [#1449](https://github.com/vuejs/vue-loader/issues/1449)
|
||||
* hide ext appending behind a flag (ref [#1372](https://github.com/vuejs/vue-loader/issues/1372)) ([f0beed3](https://github.com/vuejs/vue-loader/commit/f0beed3))
|
||||
* include query in loader dedupe ([4a894de](https://github.com/vuejs/vue-loader/commit/4a894de)), closes [vue-cli#2451](https://github.com/vue-cli/issues/2451)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* add `prettify` option ([#1461](https://github.com/vuejs/vue-loader/issues/1461)) ([62a9155](https://github.com/vuejs/vue-loader/commit/62a9155)), closes [#1426](https://github.com/vuejs/vue-loader/issues/1426)
|
||||
|
||||
|
||||
|
||||
<a name="15.4.2"></a>
|
||||
## [15.4.2](https://github.com/vuejs/vue-loader/compare/v15.4.1...v15.4.2) (2018-09-11)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* include query in loader dedupe ([4a894de](https://github.com/vuejs/vue-loader/commit/4a894de)), closes [vue-cli#2451](https://github.com/vue-cli/issues/2451)
|
||||
|
||||
|
||||
|
||||
<a name="15.4.1"></a>
|
||||
## [15.4.1](https://github.com/vuejs/vue-loader/compare/v15.4.0...v15.4.1) (2018-08-26)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* hide ext appending behind a flag (ref [#1372](https://github.com/vuejs/vue-loader/issues/1372)) ([f0beed3](https://github.com/vuejs/vue-loader/commit/f0beed3))
|
||||
|
||||
|
||||
|
||||
<a name="15.4.0"></a>
|
||||
# [15.4.0](https://github.com/vuejs/vue-loader/compare/v15.3.0...v15.4.0) (2018-08-20)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* fix inconsistent path between Windows and POSIX systems ( ([#1384](https://github.com/vuejs/vue-loader/issues/1384) ([74a7dbd](https://github.com/vuejs/vue-loader/commit/74a7dbd))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* append the file extension to the mapping files in devtools ([#1372](https://github.com/vuejs/vue-loader/issues/1372)) ([0c2da0f](https://github.com/vuejs/vue-loader/commit/0c2da0f)), closes [#1371](https://github.com/vuejs/vue-loader/issues/1371)
|
||||
|
||||
|
||||
|
||||
<a name="15.3.0"></a>
|
||||
# [15.3.0](https://github.com/vuejs/vue-loader/compare/v15.2.7...v15.3.0) (2018-08-07)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* avoid absolute path in cache-loader inline options ([c6ab50a](https://github.com/vuejs/vue-loader/commit/c6ab50a)), closes [#1367](https://github.com/vuejs/vue-loader/issues/1367)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* set file basename to __file in production ([#1368](https://github.com/vuejs/vue-loader/issues/1368)) ([2f441b9](https://github.com/vuejs/vue-loader/commit/2f441b9))
|
||||
|
||||
|
||||
|
||||
<a name="15.2.7"></a>
|
||||
## [15.2.7](https://github.com/vuejs/vue-loader/compare/v15.2.6...v15.2.7) (2018-08-07)
|
||||
|
||||
|
||||
|
||||
<a name="15.2.6"></a>
|
||||
## [15.2.6](https://github.com/vuejs/vue-loader/compare/v15.2.5...v15.2.6) (2018-07-18)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ensure consistent component id on different OS ([0766fe7](https://github.com/vuejs/vue-loader/commit/0766fe7)), closes [vuejs/vue-cli#1728](https://github.com/vuejs/vue-cli/issues/1728)
|
||||
|
||||
|
||||
|
||||
<a name="15.2.5"></a>
|
||||
## [15.2.5](https://github.com/vuejs/vue-loader/compare/v15.2.4...v15.2.5) (2018-07-17)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ensure same compiler is used for both parse and tempalte compilation ([1bfc08a](https://github.com/vuejs/vue-loader/commit/1bfc08a))
|
||||
* should not remove eslint-loader on src import blocks (close [#1359](https://github.com/vuejs/vue-loader/issues/1359)) ([6f1d404](https://github.com/vuejs/vue-loader/commit/6f1d404))
|
||||
* support usage with other loaders with enforce: post ([be2384c](https://github.com/vuejs/vue-loader/commit/be2384c)), closes [#1351](https://github.com/vuejs/vue-loader/issues/1351)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* inherit root request query in custom block loaders ([#1330](https://github.com/vuejs/vue-loader/issues/1330)) ([0f0b09b](https://github.com/vuejs/vue-loader/commit/0f0b09b))
|
||||
|
||||
|
||||
|
||||
<a name="15.2.4"></a>
|
||||
## [15.2.4](https://github.com/vuejs/vue-loader/compare/v15.2.2...v15.2.4) (2018-06-01)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ensure plugin error is emitted only once ([0b006a3](https://github.com/vuejs/vue-loader/commit/0b006a3))
|
||||
* fix unexpected error when options of cache-loader contains ! ([#1334](https://github.com/vuejs/vue-loader/issues/1334)) ([c4a2719](https://github.com/vuejs/vue-loader/commit/c4a2719))
|
||||
* use constant plugin NS ([0fb5172](https://github.com/vuejs/vue-loader/commit/0fb5172)), closes [#1331](https://github.com/vuejs/vue-loader/issues/1331)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* inject issuerPath to resourceQuery for custom block src imports ([#1313](https://github.com/vuejs/vue-loader/issues/1313)) ([a004e30](https://github.com/vuejs/vue-loader/commit/a004e30))
|
||||
|
||||
|
||||
|
||||
<a name="15.2.3"></a>
|
||||
## [15.2.3](https://github.com/vuejs/vue-loader/compare/v15.2.2...v15.2.3) (2018-06-01)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ensure plugin error is emitted only once ([0b006a3](https://github.com/vuejs/vue-loader/commit/0b006a3))
|
||||
* use constant plugin NS ([0fb5172](https://github.com/vuejs/vue-loader/commit/0fb5172)), closes [#1331](https://github.com/vuejs/vue-loader/issues/1331)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* inject issuerPath to resourceQuery for custom block src imports ([#1313](https://github.com/vuejs/vue-loader/issues/1313)) ([a004e30](https://github.com/vuejs/vue-loader/commit/a004e30))
|
||||
|
||||
|
||||
|
||||
<a name="15.2.2"></a>
|
||||
## [15.2.2](https://github.com/vuejs/vue-loader/compare/v15.2.0...v15.2.2) (2018-05-28)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* check loader for cnpm(npminstall) ([#1321](https://github.com/vuejs/vue-loader/issues/1321)) ([37fbaeb](https://github.com/vuejs/vue-loader/commit/37fbaeb))
|
||||
* ensure template cache uses unique identifier ([538198e](https://github.com/vuejs/vue-loader/commit/538198e))
|
||||
|
||||
|
||||
|
||||
<a name="15.2.1"></a>
|
||||
## [15.2.1](https://github.com/vuejs/vue-loader/compare/v15.2.0...v15.2.1) (2018-05-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ensure template cache uses unique identifier ([bdb13be](https://github.com/vuejs/vue-loader/commit/bdb13be))
|
||||
|
||||
|
||||
|
||||
<a name="15.2.0"></a>
|
||||
# [15.2.0](https://github.com/vuejs/vue-loader/compare/v15.1.0...v15.2.0) (2018-05-22)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* enable template compile caching ([28e0fd3](https://github.com/vuejs/vue-loader/commit/28e0fd3))
|
||||
|
||||
|
||||
|
||||
<a name="15.1.0"></a>
|
||||
# [15.1.0](https://github.com/vuejs/vue-loader/compare/v15.0.12...v15.1.0) (2018-05-19)
|
||||
|
||||
|
||||
### Performance Improvements
|
||||
|
||||
* avoid duplicate linting when used with eslint-loader ([3d07f81](https://github.com/vuejs/vue-loader/commit/3d07f81))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.12"></a>
|
||||
## [15.0.12](https://github.com/vuejs/vue-loader/compare/v15.0.11...v15.0.12) (2018-05-18)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ignore attrs that might interfere with query generation ([3a37269](https://github.com/vuejs/vue-loader/commit/3a37269)), closes [vuejs/vue-cli#1324](https://github.com/vuejs/vue-cli/issues/1324)
|
||||
|
||||
|
||||
|
||||
<a name="15.0.11"></a>
|
||||
## [15.0.11](https://github.com/vuejs/vue-loader/compare/v15.0.9...v15.0.11) (2018-05-15)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* improve HMR reliability ([4ccd96f](https://github.com/vuejs/vue-loader/commit/4ccd96f))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.10"></a>
|
||||
## [15.0.10](https://github.com/vuejs/vue-loader/compare/v15.0.9...v15.0.10) (2018-05-11)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* improve HMR reliability ([52012cd](https://github.com/vuejs/vue-loader/commit/52012cd))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.9"></a>
|
||||
## [15.0.9](https://github.com/vuejs/vue-loader/compare/v15.0.8...v15.0.9) (2018-05-04)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* shadowMode still has to be an option ([4529f83](https://github.com/vuejs/vue-loader/commit/4529f83))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.8"></a>
|
||||
## [15.0.8](https://github.com/vuejs/vue-loader/compare/v15.0.7...v15.0.8) (2018-05-04)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* avoid mutating original rules array ([14bfc01](https://github.com/vuejs/vue-loader/commit/14bfc01)), closes [#1286](https://github.com/vuejs/vue-loader/issues/1286)
|
||||
|
||||
|
||||
|
||||
<a name="15.0.7"></a>
|
||||
## [15.0.7](https://github.com/vuejs/vue-loader/compare/v15.0.6...v15.0.7) (2018-05-03)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* stylePostLoader injection for windows flat node_modules ([a9a4412](https://github.com/vuejs/vue-loader/commit/a9a4412)), closes [#1284](https://github.com/vuejs/vue-loader/issues/1284)
|
||||
|
||||
|
||||
|
||||
<a name="15.0.6"></a>
|
||||
## [15.0.6](https://github.com/vuejs/vue-loader/compare/v15.0.5...v15.0.6) (2018-05-02)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* duplicate loaders when using src import with loader options ([37329e1](https://github.com/vuejs/vue-loader/commit/37329e1)), closes [#1278](https://github.com/vuejs/vue-loader/issues/1278)
|
||||
|
||||
|
||||
|
||||
<a name="15.0.5"></a>
|
||||
## [15.0.5](https://github.com/vuejs/vue-loader/compare/v15.0.4...v15.0.5) (2018-04-30)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* ignore VueLoaderPlugin check when using thread-loader ([#1268](https://github.com/vuejs/vue-loader/issues/1268)) ([476f466](https://github.com/vuejs/vue-loader/commit/476f466)), closes [#1267](https://github.com/vuejs/vue-loader/issues/1267)
|
||||
|
||||
|
||||
|
||||
<a name="15.0.4"></a>
|
||||
## [15.0.4](https://github.com/vuejs/vue-loader/compare/v15.0.3...v15.0.4) (2018-04-27)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* enable whitelist in exclude function ([5b0e392](https://github.com/vuejs/vue-loader/commit/5b0e392))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.3"></a>
|
||||
## [15.0.3](https://github.com/vuejs/vue-loader/compare/v15.0.2...v15.0.3) (2018-04-26)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* handle rule.use being a string (ref: [#1256](https://github.com/vuejs/vue-loader/issues/1256)) ([fc2ba27](https://github.com/vuejs/vue-loader/commit/fc2ba27))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.2"></a>
|
||||
## [15.0.2](https://github.com/vuejs/vue-loader/compare/v15.0.1...v15.0.2) (2018-04-26)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* remove resource field in cloned rules (fix [#1254](https://github.com/vuejs/vue-loader/issues/1254)) ([35ca03f](https://github.com/vuejs/vue-loader/commit/35ca03f))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.1"></a>
|
||||
## [15.0.1](https://github.com/vuejs/vue-loader/compare/v15.0.0...v15.0.1) (2018-04-25)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* prioritize .vue rules in plugin (fix [#1246](https://github.com/vuejs/vue-loader/issues/1246)) ([bffacd5](https://github.com/vuejs/vue-loader/commit/bffacd5))
|
||||
* warn missing plugin ([068bb81](https://github.com/vuejs/vue-loader/commit/068bb81))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0"></a>
|
||||
# [15.0.0](https://github.com/vuejs/vue-loader/compare/v15.0.0-rc.2...v15.0.0) (2018-04-24)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* compat with null-loader (close [#1239](https://github.com/vuejs/vue-loader/issues/1239)) ([5cd5f6f](https://github.com/vuejs/vue-loader/commit/5cd5f6f))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* support declaring rules using .vue.html (ref [#1238](https://github.com/vuejs/vue-loader/issues/1238)) ([a3af6b3](https://github.com/vuejs/vue-loader/commit/a3af6b3))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-rc.2"></a>
|
||||
# [15.0.0-rc.2](https://github.com/vuejs/vue-loader/compare/v15.0.0-rc.1...v15.0.0-rc.2) (2018-04-11)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* avoid bailout of webpack module concatenation ([#1230](https://github.com/vuejs/vue-loader/issues/1230)) ([b983304](https://github.com/vuejs/vue-loader/commit/b983304))
|
||||
* reuse ident of css related loaders to avoid duplicates ([#1233](https://github.com/vuejs/vue-loader/issues/1233)) ([b16311f](https://github.com/vuejs/vue-loader/commit/b16311f))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-rc.1"></a>
|
||||
# [15.0.0-rc.1](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.7...v15.0.0-rc.1) (2018-04-06)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* support being used on files not ending with .vue ([5a9ee91](https://github.com/vuejs/vue-loader/commit/5a9ee91))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.7"></a>
|
||||
# [15.0.0-beta.7](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.6...v15.0.0-beta.7) (2018-03-25)
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* handle `<template lang="xxx">` with loaders ([c954f32](https://github.com/vuejs/vue-loader/commit/c954f32))
|
||||
|
||||
|
||||
### BREAKING CHANGES
|
||||
|
||||
* `<template lang="xxx">` are now handled
|
||||
with webpack loaders as well.
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.6"></a>
|
||||
# [15.0.0-beta.6](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.5...v15.0.0-beta.6) (2018-03-24)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* compat with html-webpack-plugin ([8626739](https://github.com/vuejs/vue-loader/commit/8626739)), closes [#1213](https://github.com/vuejs/vue-loader/issues/1213)
|
||||
* only reuse ident for whitelisted loaders ([230abd4](https://github.com/vuejs/vue-loader/commit/230abd4)), closes [#1214](https://github.com/vuejs/vue-loader/issues/1214)
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.5"></a>
|
||||
# [15.0.0-beta.5](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.4...v15.0.0-beta.5) (2018-03-23)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* pass correct args to RuleSet.normalizeRule (fix [#1210](https://github.com/vuejs/vue-loader/issues/1210)) ([1c54dc4](https://github.com/vuejs/vue-loader/commit/1c54dc4))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.4"></a>
|
||||
# [15.0.0-beta.4](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.3...v15.0.0-beta.4) (2018-03-23)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* avoid babel options validation error (fix [#1209](https://github.com/vuejs/vue-loader/issues/1209)) ([d3e3f5e](https://github.com/vuejs/vue-loader/commit/d3e3f5e))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.3"></a>
|
||||
# [15.0.0-beta.3](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.2...v15.0.0-beta.3) (2018-03-23)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* handle vue rule with include (fix [#1201](https://github.com/vuejs/vue-loader/issues/1201)) ([2be5507](https://github.com/vuejs/vue-loader/commit/2be5507))
|
||||
* make sure cloned rules reuse the exact same ident in options ([eab9460](https://github.com/vuejs/vue-loader/commit/eab9460)), closes [#1199](https://github.com/vuejs/vue-loader/issues/1199)
|
||||
* remove rule.loaders from normalized rules ([#1207](https://github.com/vuejs/vue-loader/issues/1207)) ([e9cbbcd](https://github.com/vuejs/vue-loader/commit/e9cbbcd))
|
||||
* support test-less oneOf rules ([7208885](https://github.com/vuejs/vue-loader/commit/7208885))
|
||||
* use relative path for self path resolution ([343b9df](https://github.com/vuejs/vue-loader/commit/343b9df))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* **loader:** support options.productionMode ([#1208](https://github.com/vuejs/vue-loader/issues/1208)) ([69bc1c1](https://github.com/vuejs/vue-loader/commit/69bc1c1))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.2"></a>
|
||||
# [15.0.0-beta.2](https://github.com/vuejs/vue-loader/compare/v15.0.0-beta.1...v15.0.0-beta.2) (2018-03-22)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* loader check for windows ([ab067b0](https://github.com/vuejs/vue-loader/commit/ab067b0))
|
||||
* properly stringify hot-reload-api path for Windows ([fb1306e](https://github.com/vuejs/vue-loader/commit/fb1306e))
|
||||
|
||||
|
||||
|
||||
<a name="15.0.0-beta.1"></a>
|
||||
# [15.0.0-beta.1](https://github.com/vuejs/vue-loader/compare/f418bd9...v15.0.0-beta.1) (2018-03-21)
|
||||
|
||||
|
||||
### Bug Fixes
|
||||
|
||||
* remove .vue from fake resourcePath to avoid double match ([7c5b6ac](https://github.com/vuejs/vue-loader/commit/7c5b6ac))
|
||||
|
||||
|
||||
### Features
|
||||
|
||||
* basic hot reload ([f418bd9](https://github.com/vuejs/vue-loader/commit/f418bd9))
|
||||
* css modules + hmr ([99754c0](https://github.com/vuejs/vue-loader/commit/99754c0))
|
||||
* dynamic style injection ([234d48b](https://github.com/vuejs/vue-loader/commit/234d48b))
|
||||
* expose all block attrs via query ([cda1ec3](https://github.com/vuejs/vue-loader/commit/cda1ec3))
|
||||
* respect user compiler / compilerOptions ([58239f6](https://github.com/vuejs/vue-loader/commit/58239f6))
|
||||
* support configuring loader for custom blocks via resourceQuery ([d04f9cf](https://github.com/vuejs/vue-loader/commit/d04f9cf))
|
||||
* support rules with oneOf ([c3b379d](https://github.com/vuejs/vue-loader/commit/c3b379d))
|
||||
|
||||
|
||||
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2015-present Yuxi (Evan) You
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
+120
@@ -0,0 +1,120 @@
|
||||
# vue-loader [](https://circleci.com/gh/vuejs/vue-loader/tree/master) [](https://ci.appveyor.com/project/yyx990803/vue-loader/branch/master)
|
||||
|
||||
> webpack loader for Vue Single-File Components
|
||||
|
||||
**NOTE:** The master branch now hosts the code for v15! Legacy code is now in the [v14 branch](https://github.com/vuejs/vue-loader/tree/v14).
|
||||
|
||||
- [Documentation](https://vue-loader.vuejs.org)
|
||||
- [Migrating from v14](https://vue-loader.vuejs.org/migrating.html)
|
||||
|
||||
## What is Vue Loader?
|
||||
|
||||
`vue-loader` is a loader for [webpack](https://webpack.js.org/) that allows you to author Vue components in a format called [Single-File Components (SFCs)](./docs/spec.md):
|
||||
|
||||
``` vue
|
||||
<template>
|
||||
<div class="example">{{ msg }}</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
msg: 'Hello world!'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.example {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
||||
```
|
||||
|
||||
There are many cool features provided by `vue-loader`:
|
||||
|
||||
- Allows using other webpack loaders for each part of a Vue component, for example Sass for `<style>` and Pug for `<template>`;
|
||||
- Allows custom blocks in a `.vue` file that can have custom loader chains applied to them;
|
||||
- Treat static assets referenced in `<style>` and `<template>` as module dependencies and handle them with webpack loaders;
|
||||
- Simulate scoped CSS for each component;
|
||||
- State-preserving hot-reloading during development.
|
||||
|
||||
In a nutshell, the combination of webpack and `vue-loader` gives you a modern, flexible and extremely powerful front-end workflow for authoring Vue.js applications.
|
||||
|
||||
## How It Works
|
||||
|
||||
> The following section is for maintainers and contributors who are interested in the internal implementation details of `vue-loader`, and is **not** required knowledge for end users.
|
||||
|
||||
`vue-loader` is not a simple source transform loader. It handles each language blocks inside an SFC with its own dedicated loader chain (you can think of each block as a "virtual module"), and finally assembles the blocks together into the final module. Here's a brief overview of how the whole thing works:
|
||||
|
||||
1. `vue-loader` parses the SFC source code into an *SFC Descriptor* using `@vue/component-compiler-utils`. It then generates an import for each language block so the actual returned module code looks like this:
|
||||
|
||||
``` js
|
||||
// code returned from the main loader for 'source.vue'
|
||||
|
||||
// import the <template> block
|
||||
import render from 'source.vue?vue&type=template'
|
||||
// import the <script> block
|
||||
import script from 'source.vue?vue&type=script'
|
||||
export * from 'source.vue?vue&type=script'
|
||||
// import <style> blocks
|
||||
import 'source.vue?vue&type=style&index=1'
|
||||
|
||||
script.render = render
|
||||
export default script
|
||||
```
|
||||
|
||||
Notice how the code is importing `source.vue` itself, but with different request queries for each block.
|
||||
|
||||
2. We want the content in `script` block to be treated like `.js` files (and if it's `<script lang="ts">`, we want to to be treated like `.ts` files). Same for other language blocks. So we want webpack to apply any configured module rules that matches `.js` also to requests that look like `source.vue?vue&type=script`. This is what `VueLoaderPlugin` (`src/plugins.ts`) does: for each module rule in the webpack config, it creates a modified clone that targets corresponding Vue language block requests.
|
||||
|
||||
Suppose we have configured `babel-loader` for all `*.js` files. That rule will be cloned and applied to Vue SFC `<script>` blocks as well. Internally to webpack, a request like
|
||||
|
||||
``` js
|
||||
import script from 'source.vue?vue&type=script'
|
||||
```
|
||||
|
||||
Will expand to:
|
||||
|
||||
``` js
|
||||
import script from 'babel-loader!vue-loader!source.vue?vue&type=script'
|
||||
```
|
||||
|
||||
Notice the `vue-loader` is also matched because `vue-loader` are applied to `.vue` files.
|
||||
|
||||
Similarly, if you have configured `style-loader` + `css-loader` + `sass-loader` for `*.scss` files:
|
||||
|
||||
``` html
|
||||
<style scoped lang="scss">
|
||||
```
|
||||
|
||||
Will be returned by `vue-loader` as:
|
||||
|
||||
``` js
|
||||
import 'source.vue?vue&type=style&index=1&scoped&lang=scss'
|
||||
```
|
||||
|
||||
And webpack will expand it to:
|
||||
|
||||
``` js
|
||||
import 'style-loader!css-loader!sass-loader!vue-loader!source.vue?vue&type=style&index=1&scoped&lang=scss'
|
||||
```
|
||||
|
||||
3. When processing the expanded requests, the main `vue-loader` will get invoked again. This time though, the loader notices that the request has queries and is targeting a specific block only. So it selects (`src/select.ts`) the inner content of the target block and passes it on to the loaders matched after it.
|
||||
|
||||
4. For the `<script>` block, this is pretty much it. For `<template>` and `<style>` blocks though, a few extra tasks need to be performed:
|
||||
|
||||
- We need to compile the template using the Vue template compiler;
|
||||
- We need to post-process the CSS in `<style scoped>` blocks, **after** `css-loader` but **before** `style-loader`.
|
||||
|
||||
Technically, these are additional loaders (`src/templateLoader.ts` and `src/stylePostLoader.ts`) that need to be injected into the expanded loader chain. It would be very complicated if the end users have to configure this themselves, so `VueLoaderPlugin` also injects a global [Pitching Loader](https://webpack.js.org/api/loaders/#pitching-loader) (`src/pitcher.ts`) that intercepts Vue `<template>` and `<style>` requests and injects the necessary loaders. The final requests look like the following:
|
||||
|
||||
``` js
|
||||
// <template lang="pug">
|
||||
import 'vue-loader/template-loader!pug-loader!source.vue?vue&type=template'
|
||||
|
||||
// <style scoped lang="scss">
|
||||
import 'style-loader!vue-loader/style-post-loader!css-loader!sass-loader!vue-loader!source.vue?vue&type=style&index=1&scoped&lang=scss'
|
||||
```
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
const qs = require('querystring')
|
||||
const { attrsToQuery } = require('./utils')
|
||||
|
||||
module.exports = function genCustomBlocksCode (
|
||||
blocks,
|
||||
resourcePath,
|
||||
resourceQuery,
|
||||
stringifyRequest
|
||||
) {
|
||||
return `\n/* custom blocks */\n` + blocks.map((block, i) => {
|
||||
const src = block.attrs.src || resourcePath
|
||||
const attrsQuery = attrsToQuery(block.attrs)
|
||||
const issuerQuery = block.attrs.src ? `&issuerPath=${qs.escape(resourcePath)}` : ''
|
||||
const inheritQuery = resourceQuery ? `&${resourceQuery.slice(1)}` : ''
|
||||
const query = `?vue&type=custom&index=${i}&blockType=${qs.escape(block.type)}${issuerQuery}${attrsQuery}${inheritQuery}`
|
||||
return (
|
||||
`import block${i} from ${stringifyRequest(src + query)}\n` +
|
||||
`if (typeof block${i} === 'function') block${i}(component)`
|
||||
)
|
||||
}).join(`\n`) + `\n`
|
||||
}
|
||||
+31
@@ -0,0 +1,31 @@
|
||||
const hotReloadAPIPath = JSON.stringify(require.resolve('vue-hot-reload-api'))
|
||||
|
||||
const genTemplateHotReloadCode = (id, request) => {
|
||||
return `
|
||||
module.hot.accept(${request}, function () {
|
||||
api.rerender('${id}', {
|
||||
render: render,
|
||||
staticRenderFns: staticRenderFns
|
||||
})
|
||||
})
|
||||
`.trim()
|
||||
}
|
||||
|
||||
exports.genHotReloadCode = (id, functional, templateRequest) => {
|
||||
return `
|
||||
/* hot reload */
|
||||
if (module.hot) {
|
||||
var api = require(${hotReloadAPIPath})
|
||||
api.install(require('vue'))
|
||||
if (api.compatible) {
|
||||
module.hot.accept()
|
||||
if (!api.isRecorded('${id}')) {
|
||||
api.createRecord('${id}', component.options)
|
||||
} else {
|
||||
api.${functional ? 'rerender' : 'reload'}('${id}', component.options)
|
||||
}
|
||||
${templateRequest ? genTemplateHotReloadCode(id, templateRequest) : ''}
|
||||
}
|
||||
}
|
||||
`.trim()
|
||||
}
|
||||
+123
@@ -0,0 +1,123 @@
|
||||
const { attrsToQuery } = require('./utils')
|
||||
const hotReloadAPIPath = JSON.stringify(require.resolve('vue-hot-reload-api'))
|
||||
const nonWhitespaceRE = /\S+/
|
||||
|
||||
module.exports = function genStyleInjectionCode (
|
||||
loaderContext,
|
||||
styles,
|
||||
id,
|
||||
resourcePath,
|
||||
stringifyRequest,
|
||||
needsHotReload,
|
||||
needsExplicitInjection
|
||||
) {
|
||||
let styleImportsCode = ``
|
||||
let styleInjectionCode = ``
|
||||
let cssModulesHotReloadCode = ``
|
||||
|
||||
let hasCSSModules = false
|
||||
const cssModuleNames = new Map()
|
||||
|
||||
function genStyleRequest (style, i) {
|
||||
const src = style.src || resourcePath
|
||||
const attrsQuery = attrsToQuery(style.attrs, 'css')
|
||||
const inheritQuery = `&${loaderContext.resourceQuery.slice(1)}`
|
||||
// make sure to only pass id when necessary so that we don't inject
|
||||
// duplicate tags when multiple components import the same css file
|
||||
const idQuery = style.scoped ? `&id=${id}` : ``
|
||||
const query = `?vue&type=style&index=${i}${idQuery}${attrsQuery}${inheritQuery}`
|
||||
return stringifyRequest(src + query)
|
||||
}
|
||||
|
||||
function genCSSModulesCode (style, request, i) {
|
||||
hasCSSModules = true
|
||||
|
||||
const moduleName = style.module === true ? '$style' : style.module
|
||||
if (cssModuleNames.has(moduleName)) {
|
||||
loaderContext.emitError(`CSS module name ${moduleName} is not unique!`)
|
||||
}
|
||||
cssModuleNames.set(moduleName, true)
|
||||
|
||||
// `(vue-)style-loader` exports the name-to-hash map directly
|
||||
// `css-loader` exports it in `.locals`
|
||||
const locals = `(style${i}.locals || style${i})`
|
||||
const name = JSON.stringify(moduleName)
|
||||
|
||||
if (!needsHotReload) {
|
||||
styleInjectionCode += `this[${name}] = ${locals}\n`
|
||||
} else {
|
||||
styleInjectionCode += `
|
||||
cssModules[${name}] = ${locals}
|
||||
Object.defineProperty(this, ${name}, {
|
||||
configurable: true,
|
||||
get: function () {
|
||||
return cssModules[${name}]
|
||||
}
|
||||
})
|
||||
`
|
||||
cssModulesHotReloadCode += `
|
||||
module.hot && module.hot.accept([${request}], function () {
|
||||
var oldLocals = cssModules[${name}]
|
||||
if (oldLocals) {
|
||||
var newLocals = require(${request})
|
||||
if (JSON.stringify(newLocals) !== JSON.stringify(oldLocals)) {
|
||||
cssModules[${name}] = newLocals
|
||||
require(${hotReloadAPIPath}).rerender("${id}")
|
||||
}
|
||||
}
|
||||
})
|
||||
`
|
||||
}
|
||||
}
|
||||
|
||||
// empty styles: with no `src` specified or only contains whitespaces
|
||||
const isNotEmptyStyle = style => style.src || nonWhitespaceRE.test(style.content)
|
||||
// explicit injection is needed in SSR (for critical CSS collection)
|
||||
// or in Shadow Mode (for injection into shadow root)
|
||||
// In these modes, vue-style-loader exports objects with the __inject__
|
||||
// method; otherwise we simply import the styles.
|
||||
if (!needsExplicitInjection) {
|
||||
styles.forEach((style, i) => {
|
||||
// do not generate requests for empty styles
|
||||
if (isNotEmptyStyle(style)) {
|
||||
const request = genStyleRequest(style, i)
|
||||
styleImportsCode += `import style${i} from ${request}\n`
|
||||
if (style.module) genCSSModulesCode(style, request, i)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
styles.forEach((style, i) => {
|
||||
if (isNotEmptyStyle(style)) {
|
||||
const request = genStyleRequest(style, i)
|
||||
styleInjectionCode += (
|
||||
`var style${i} = require(${request})\n` +
|
||||
`if (style${i}.__inject__) style${i}.__inject__(context)\n`
|
||||
)
|
||||
if (style.module) genCSSModulesCode(style, request, i)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
if (!needsExplicitInjection && !hasCSSModules) {
|
||||
return styleImportsCode
|
||||
}
|
||||
|
||||
return `
|
||||
${styleImportsCode}
|
||||
${hasCSSModules && needsHotReload ? `var cssModules = {}` : ``}
|
||||
${needsHotReload ? `var disposed = false` : ``}
|
||||
|
||||
function injectStyles (context) {
|
||||
${needsHotReload ? `if (disposed) return` : ``}
|
||||
${styleInjectionCode}
|
||||
}
|
||||
|
||||
${needsHotReload ? `
|
||||
module.hot && module.hot.dispose(function (data) {
|
||||
disposed = true
|
||||
})
|
||||
` : ``}
|
||||
|
||||
${cssModulesHotReloadCode}
|
||||
`.trim()
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
const qs = require('querystring')
|
||||
|
||||
// these are built-in query parameters so should be ignored
|
||||
// if the user happen to add them as attrs
|
||||
const ignoreList = [
|
||||
'id',
|
||||
'index',
|
||||
'src',
|
||||
'type'
|
||||
]
|
||||
|
||||
// transform the attrs on a SFC block descriptor into a resourceQuery string
|
||||
exports.attrsToQuery = (attrs, langFallback) => {
|
||||
let query = ``
|
||||
for (const name in attrs) {
|
||||
const value = attrs[name]
|
||||
if (!ignoreList.includes(name)) {
|
||||
query += `&${qs.escape(name)}=${value ? qs.escape(value) : ``}`
|
||||
}
|
||||
}
|
||||
if (langFallback && !(`lang` in attrs)) {
|
||||
query += `&lang=${langFallback}`
|
||||
}
|
||||
return query
|
||||
}
|
||||
+24
@@ -0,0 +1,24 @@
|
||||
import { Plugin } from 'webpack'
|
||||
import { VueTemplateCompiler } from '@vue/component-compiler-utils/dist/types'
|
||||
import { CompilerOptions } from 'vue-template-compiler'
|
||||
|
||||
declare namespace VueLoader {
|
||||
class VueLoaderPlugin extends Plugin {}
|
||||
|
||||
interface VueLoaderOptions {
|
||||
transformAssetUrls?: { [tag: string]: string | Array<string> }
|
||||
compiler?: VueTemplateCompiler
|
||||
compilerOptions?: CompilerOptions
|
||||
transpileOptions?: Object
|
||||
optimizeSSR?: boolean
|
||||
hotReload?: boolean
|
||||
productionMode?: boolean
|
||||
shadowMode?: boolean
|
||||
cacheDirectory?: string
|
||||
cacheIdentifier?: string
|
||||
prettify?: boolean
|
||||
exposeFilename?: boolean
|
||||
}
|
||||
}
|
||||
|
||||
export = VueLoader
|
||||
+197
@@ -0,0 +1,197 @@
|
||||
const path = require('path')
|
||||
const hash = require('hash-sum')
|
||||
const qs = require('querystring')
|
||||
const plugin = require('./plugin')
|
||||
const selectBlock = require('./select')
|
||||
const loaderUtils = require('loader-utils')
|
||||
const { attrsToQuery } = require('./codegen/utils')
|
||||
const { parse } = require('@vue/component-compiler-utils')
|
||||
const genStylesCode = require('./codegen/styleInjection')
|
||||
const { genHotReloadCode } = require('./codegen/hotReload')
|
||||
const genCustomBlocksCode = require('./codegen/customBlocks')
|
||||
const componentNormalizerPath = require.resolve('./runtime/componentNormalizer')
|
||||
const { NS } = require('./plugin')
|
||||
|
||||
let errorEmitted = false
|
||||
|
||||
function loadTemplateCompiler (loaderContext) {
|
||||
try {
|
||||
return require('vue-template-compiler')
|
||||
} catch (e) {
|
||||
if (/version mismatch/.test(e.toString())) {
|
||||
loaderContext.emitError(e)
|
||||
} else {
|
||||
loaderContext.emitError(new Error(
|
||||
`[vue-loader] vue-template-compiler must be installed as a peer dependency, ` +
|
||||
`or a compatible compiler implementation must be passed via options.`
|
||||
))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = function (source) {
|
||||
const loaderContext = this
|
||||
|
||||
if (!errorEmitted && !loaderContext['thread-loader'] && !loaderContext[NS]) {
|
||||
loaderContext.emitError(new Error(
|
||||
`vue-loader was used without the corresponding plugin. ` +
|
||||
`Make sure to include VueLoaderPlugin in your webpack config.`
|
||||
))
|
||||
errorEmitted = true
|
||||
}
|
||||
|
||||
const stringifyRequest = r => loaderUtils.stringifyRequest(loaderContext, r)
|
||||
|
||||
const {
|
||||
target,
|
||||
request,
|
||||
minimize,
|
||||
sourceMap,
|
||||
rootContext,
|
||||
resourcePath,
|
||||
resourceQuery
|
||||
} = loaderContext
|
||||
|
||||
const rawQuery = resourceQuery.slice(1)
|
||||
const inheritQuery = `&${rawQuery}`
|
||||
const incomingQuery = qs.parse(rawQuery)
|
||||
const options = loaderUtils.getOptions(loaderContext) || {}
|
||||
|
||||
const isServer = target === 'node'
|
||||
const isShadow = !!options.shadowMode
|
||||
const isProduction = options.productionMode || minimize || process.env.NODE_ENV === 'production'
|
||||
const filename = path.basename(resourcePath)
|
||||
const context = rootContext || process.cwd()
|
||||
const sourceRoot = path.dirname(path.relative(context, resourcePath))
|
||||
|
||||
const descriptor = parse({
|
||||
source,
|
||||
compiler: options.compiler || loadTemplateCompiler(loaderContext),
|
||||
filename,
|
||||
sourceRoot,
|
||||
needMap: sourceMap
|
||||
})
|
||||
|
||||
// if the query has a type field, this is a language block request
|
||||
// e.g. foo.vue?type=template&id=xxxxx
|
||||
// and we will return early
|
||||
if (incomingQuery.type) {
|
||||
return selectBlock(
|
||||
descriptor,
|
||||
loaderContext,
|
||||
incomingQuery,
|
||||
!!options.appendExtension
|
||||
)
|
||||
}
|
||||
|
||||
// module id for scoped CSS & hot-reload
|
||||
const rawShortFilePath = path
|
||||
.relative(context, resourcePath)
|
||||
.replace(/^(\.\.[\/\\])+/, '')
|
||||
|
||||
const shortFilePath = rawShortFilePath.replace(/\\/g, '/') + resourceQuery
|
||||
|
||||
const id = hash(
|
||||
isProduction
|
||||
? (shortFilePath + '\n' + source)
|
||||
: shortFilePath
|
||||
)
|
||||
|
||||
// feature information
|
||||
const hasScoped = descriptor.styles.some(s => s.scoped)
|
||||
const hasFunctional = descriptor.template && descriptor.template.attrs.functional
|
||||
const needsHotReload = (
|
||||
!isServer &&
|
||||
!isProduction &&
|
||||
(descriptor.script || descriptor.template) &&
|
||||
options.hotReload !== false
|
||||
)
|
||||
|
||||
// template
|
||||
let templateImport = `var render, staticRenderFns`
|
||||
let templateRequest
|
||||
if (descriptor.template) {
|
||||
const src = descriptor.template.src || resourcePath
|
||||
const idQuery = `&id=${id}`
|
||||
const scopedQuery = hasScoped ? `&scoped=true` : ``
|
||||
const attrsQuery = attrsToQuery(descriptor.template.attrs)
|
||||
const query = `?vue&type=template${idQuery}${scopedQuery}${attrsQuery}${inheritQuery}`
|
||||
const request = templateRequest = stringifyRequest(src + query)
|
||||
templateImport = `import { render, staticRenderFns } from ${request}`
|
||||
}
|
||||
|
||||
// script
|
||||
let scriptImport = `var script = {}`
|
||||
if (descriptor.script) {
|
||||
const src = descriptor.script.src || resourcePath
|
||||
const attrsQuery = attrsToQuery(descriptor.script.attrs, 'js')
|
||||
const query = `?vue&type=script${attrsQuery}${inheritQuery}`
|
||||
const request = stringifyRequest(src + query)
|
||||
scriptImport = (
|
||||
`import script from ${request}\n` +
|
||||
`export * from ${request}` // support named exports
|
||||
)
|
||||
}
|
||||
|
||||
// styles
|
||||
let stylesCode = ``
|
||||
if (descriptor.styles.length) {
|
||||
stylesCode = genStylesCode(
|
||||
loaderContext,
|
||||
descriptor.styles,
|
||||
id,
|
||||
resourcePath,
|
||||
stringifyRequest,
|
||||
needsHotReload,
|
||||
isServer || isShadow // needs explicit injection?
|
||||
)
|
||||
}
|
||||
|
||||
let code = `
|
||||
${templateImport}
|
||||
${scriptImport}
|
||||
${stylesCode}
|
||||
|
||||
/* normalize component */
|
||||
import normalizer from ${stringifyRequest(`!${componentNormalizerPath}`)}
|
||||
var component = normalizer(
|
||||
script,
|
||||
render,
|
||||
staticRenderFns,
|
||||
${hasFunctional ? `true` : `false`},
|
||||
${/injectStyles/.test(stylesCode) ? `injectStyles` : `null`},
|
||||
${hasScoped ? JSON.stringify(id) : `null`},
|
||||
${isServer ? JSON.stringify(hash(request)) : `null`}
|
||||
${isShadow ? `,true` : ``}
|
||||
)
|
||||
`.trim() + `\n`
|
||||
|
||||
if (descriptor.customBlocks && descriptor.customBlocks.length) {
|
||||
code += genCustomBlocksCode(
|
||||
descriptor.customBlocks,
|
||||
resourcePath,
|
||||
resourceQuery,
|
||||
stringifyRequest
|
||||
)
|
||||
}
|
||||
|
||||
if (needsHotReload) {
|
||||
code += `\n` + genHotReloadCode(id, hasFunctional, templateRequest)
|
||||
}
|
||||
|
||||
// Expose filename. This is used by the devtools and Vue runtime warnings.
|
||||
if (!isProduction) {
|
||||
// Expose the file's full path in development, so that it can be opened
|
||||
// from the devtools.
|
||||
code += `\ncomponent.options.__file = ${JSON.stringify(rawShortFilePath.replace(/\\/g, '/'))}`
|
||||
} else if (options.exposeFilename) {
|
||||
// Libraries can opt-in to expose their components' filenames in production builds.
|
||||
// For security reasons, only expose the file's basename in production.
|
||||
code += `\ncomponent.options.__file = ${JSON.stringify(filename)}`
|
||||
}
|
||||
|
||||
code += `\nexport default component.exports`
|
||||
return code
|
||||
}
|
||||
|
||||
module.exports.VueLoaderPlugin = plugin
|
||||
+167
@@ -0,0 +1,167 @@
|
||||
const qs = require('querystring')
|
||||
const loaderUtils = require('loader-utils')
|
||||
const hash = require('hash-sum')
|
||||
const selfPath = require.resolve('../index')
|
||||
const templateLoaderPath = require.resolve('./templateLoader')
|
||||
const stylePostLoaderPath = require.resolve('./stylePostLoader')
|
||||
|
||||
const isESLintLoader = l => /(\/|\\|@)eslint-loader/.test(l.path)
|
||||
const isNullLoader = l => /(\/|\\|@)null-loader/.test(l.path)
|
||||
const isCSSLoader = l => /(\/|\\|@)css-loader/.test(l.path)
|
||||
const isCacheLoader = l => /(\/|\\|@)cache-loader/.test(l.path)
|
||||
const isPitcher = l => l.path !== __filename
|
||||
const isPreLoader = l => !l.pitchExecuted
|
||||
const isPostLoader = l => l.pitchExecuted
|
||||
|
||||
const dedupeESLintLoader = loaders => {
|
||||
const res = []
|
||||
let seen = false
|
||||
loaders.forEach(l => {
|
||||
if (!isESLintLoader(l)) {
|
||||
res.push(l)
|
||||
} else if (!seen) {
|
||||
seen = true
|
||||
res.push(l)
|
||||
}
|
||||
})
|
||||
return res
|
||||
}
|
||||
|
||||
const shouldIgnoreCustomBlock = loaders => {
|
||||
const actualLoaders = loaders.filter(loader => {
|
||||
// vue-loader
|
||||
if (loader.path === selfPath) {
|
||||
return false
|
||||
}
|
||||
|
||||
// cache-loader
|
||||
if (isCacheLoader(loader)) {
|
||||
return false
|
||||
}
|
||||
|
||||
return true
|
||||
})
|
||||
return actualLoaders.length === 0
|
||||
}
|
||||
|
||||
module.exports = code => code
|
||||
|
||||
// This pitching loader is responsible for intercepting all vue block requests
|
||||
// and transform it into appropriate requests.
|
||||
module.exports.pitch = function (remainingRequest) {
|
||||
const options = loaderUtils.getOptions(this)
|
||||
const { cacheDirectory, cacheIdentifier } = options
|
||||
const query = qs.parse(this.resourceQuery.slice(1))
|
||||
|
||||
let loaders = this.loaders
|
||||
|
||||
// if this is a language block request, eslint-loader may get matched
|
||||
// multiple times
|
||||
if (query.type) {
|
||||
// if this is an inline block, since the whole file itself is being linted,
|
||||
// remove eslint-loader to avoid duplicate linting.
|
||||
if (/\.vue$/.test(this.resourcePath)) {
|
||||
loaders = loaders.filter(l => !isESLintLoader(l))
|
||||
} else {
|
||||
// This is a src import. Just make sure there's not more than 1 instance
|
||||
// of eslint present.
|
||||
loaders = dedupeESLintLoader(loaders)
|
||||
}
|
||||
}
|
||||
|
||||
// remove self
|
||||
loaders = loaders.filter(isPitcher)
|
||||
|
||||
// do not inject if user uses null-loader to void the type (#1239)
|
||||
if (loaders.some(isNullLoader)) {
|
||||
return
|
||||
}
|
||||
|
||||
const genRequest = loaders => {
|
||||
// Important: dedupe since both the original rule
|
||||
// and the cloned rule would match a source import request.
|
||||
// also make sure to dedupe based on loader path.
|
||||
// assumes you'd probably never want to apply the same loader on the same
|
||||
// file twice.
|
||||
// Exception: in Vue CLI we do need two instances of postcss-loader
|
||||
// for user config and inline minification. So we need to dedupe baesd on
|
||||
// path AND query to be safe.
|
||||
const seen = new Map()
|
||||
const loaderStrings = []
|
||||
|
||||
loaders.forEach(loader => {
|
||||
const identifier = typeof loader === 'string'
|
||||
? loader
|
||||
: (loader.path + loader.query)
|
||||
const request = typeof loader === 'string' ? loader : loader.request
|
||||
if (!seen.has(identifier)) {
|
||||
seen.set(identifier, true)
|
||||
// loader.request contains both the resolved loader path and its options
|
||||
// query (e.g. ??ref-0)
|
||||
loaderStrings.push(request)
|
||||
}
|
||||
})
|
||||
|
||||
return loaderUtils.stringifyRequest(this, '-!' + [
|
||||
...loaderStrings,
|
||||
this.resourcePath + this.resourceQuery
|
||||
].join('!'))
|
||||
}
|
||||
|
||||
// Inject style-post-loader before css-loader for scoped CSS and trimming
|
||||
if (query.type === `style`) {
|
||||
const cssLoaderIndex = loaders.findIndex(isCSSLoader)
|
||||
if (cssLoaderIndex > -1) {
|
||||
const afterLoaders = loaders.slice(0, cssLoaderIndex + 1)
|
||||
const beforeLoaders = loaders.slice(cssLoaderIndex + 1)
|
||||
const request = genRequest([
|
||||
...afterLoaders,
|
||||
stylePostLoaderPath,
|
||||
...beforeLoaders
|
||||
])
|
||||
// console.log(request)
|
||||
return `import mod from ${request}; export default mod; export * from ${request}`
|
||||
}
|
||||
}
|
||||
|
||||
// for templates: inject the template compiler & optional cache
|
||||
if (query.type === `template`) {
|
||||
const path = require('path')
|
||||
const cacheLoader = cacheDirectory && cacheIdentifier
|
||||
? [`${require.resolve('cache-loader')}?${JSON.stringify({
|
||||
// For some reason, webpack fails to generate consistent hash if we
|
||||
// use absolute paths here, even though the path is only used in a
|
||||
// comment. For now we have to ensure cacheDirectory is a relative path.
|
||||
cacheDirectory: (path.isAbsolute(cacheDirectory)
|
||||
? path.relative(process.cwd(), cacheDirectory)
|
||||
: cacheDirectory).replace(/\\/g, '/'),
|
||||
cacheIdentifier: hash(cacheIdentifier) + '-vue-loader-template'
|
||||
})}`]
|
||||
: []
|
||||
|
||||
const preLoaders = loaders.filter(isPreLoader)
|
||||
const postLoaders = loaders.filter(isPostLoader)
|
||||
|
||||
const request = genRequest([
|
||||
...cacheLoader,
|
||||
...postLoaders,
|
||||
templateLoaderPath + `??vue-loader-options`,
|
||||
...preLoaders
|
||||
])
|
||||
// console.log(request)
|
||||
// the template compiler uses esm exports
|
||||
return `export * from ${request}`
|
||||
}
|
||||
|
||||
// if a custom block has no other matching loader other than vue-loader itself
|
||||
// or cache-loader, we should ignore it
|
||||
if (query.type === `custom` && shouldIgnoreCustomBlock(loaders)) {
|
||||
return ``
|
||||
}
|
||||
|
||||
// When the user defines a rule that has only resourceQuery but no test,
|
||||
// both that rule and the cloned rule will match, resulting in duplicated
|
||||
// loaders. Therefore it is necessary to perform a dedupe here.
|
||||
const request = genRequest(loaders)
|
||||
return `import mod from ${request}; export default mod; export * from ${request}`
|
||||
}
|
||||
+23
@@ -0,0 +1,23 @@
|
||||
const qs = require('querystring')
|
||||
const { compileStyle } = require('@vue/component-compiler-utils')
|
||||
|
||||
// This is a post loader that handles scoped CSS transforms.
|
||||
// Injected right before css-loader by the global pitcher (../pitch.js)
|
||||
// for any <style scoped> selection requests initiated from within vue files.
|
||||
module.exports = function (source, inMap) {
|
||||
const query = qs.parse(this.resourceQuery.slice(1))
|
||||
const { code, map, errors } = compileStyle({
|
||||
source,
|
||||
filename: this.resourcePath,
|
||||
id: `data-v-${query.id}`,
|
||||
map: inMap,
|
||||
scoped: !!query.scoped,
|
||||
trim: true
|
||||
})
|
||||
|
||||
if (errors.length) {
|
||||
this.callback(errors[0])
|
||||
} else {
|
||||
this.callback(null, code, map)
|
||||
}
|
||||
}
|
||||
+89
@@ -0,0 +1,89 @@
|
||||
const qs = require('querystring')
|
||||
const loaderUtils = require('loader-utils')
|
||||
const { compileTemplate } = require('@vue/component-compiler-utils')
|
||||
|
||||
// Loader that compiles raw template into JavaScript functions.
|
||||
// This is injected by the global pitcher (../pitch) for template
|
||||
// selection requests initiated from vue files.
|
||||
module.exports = function (source) {
|
||||
const loaderContext = this
|
||||
const query = qs.parse(this.resourceQuery.slice(1))
|
||||
|
||||
// although this is not the main vue-loader, we can get access to the same
|
||||
// vue-loader options because we've set an ident in the plugin and used that
|
||||
// ident to create the request for this loader in the pitcher.
|
||||
const options = loaderUtils.getOptions(loaderContext) || {}
|
||||
const { id } = query
|
||||
const isServer = loaderContext.target === 'node'
|
||||
const isProduction = options.productionMode || loaderContext.minimize || process.env.NODE_ENV === 'production'
|
||||
const isFunctional = query.functional
|
||||
|
||||
// allow using custom compiler via options
|
||||
const compiler = options.compiler || require('vue-template-compiler')
|
||||
|
||||
const compilerOptions = Object.assign({
|
||||
outputSourceRange: true
|
||||
}, options.compilerOptions, {
|
||||
scopeId: query.scoped ? `data-v-${id}` : null,
|
||||
comments: query.comments
|
||||
})
|
||||
|
||||
// for vue-component-compiler
|
||||
const finalOptions = {
|
||||
source,
|
||||
filename: this.resourcePath,
|
||||
compiler,
|
||||
compilerOptions,
|
||||
// allow customizing behavior of vue-template-es2015-compiler
|
||||
transpileOptions: options.transpileOptions,
|
||||
transformAssetUrls: options.transformAssetUrls || true,
|
||||
isProduction,
|
||||
isFunctional,
|
||||
optimizeSSR: isServer && options.optimizeSSR !== false,
|
||||
prettify: options.prettify
|
||||
}
|
||||
|
||||
const compiled = compileTemplate(finalOptions)
|
||||
|
||||
// tips
|
||||
if (compiled.tips && compiled.tips.length) {
|
||||
compiled.tips.forEach(tip => {
|
||||
loaderContext.emitWarning(typeof tip === 'object' ? tip.msg : tip)
|
||||
})
|
||||
}
|
||||
|
||||
// errors
|
||||
if (compiled.errors && compiled.errors.length) {
|
||||
// 2.6 compiler outputs errors as objects with range
|
||||
if (compiler.generateCodeFrame && finalOptions.compilerOptions.outputSourceRange) {
|
||||
// TODO account for line offset in case template isn't placed at top
|
||||
// of the file
|
||||
loaderContext.emitError(
|
||||
`\n\n Errors compiling template:\n\n` +
|
||||
compiled.errors.map(({ msg, start, end }) => {
|
||||
const frame = compiler.generateCodeFrame(source, start, end)
|
||||
return ` ${msg}\n\n${pad(frame)}`
|
||||
}).join(`\n\n`) +
|
||||
'\n'
|
||||
)
|
||||
} else {
|
||||
loaderContext.emitError(
|
||||
`\n Error compiling template:\n${pad(compiled.source)}\n` +
|
||||
compiled.errors.map(e => ` - ${e}`).join('\n') +
|
||||
'\n'
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const { code } = compiled
|
||||
|
||||
// finish with ESM exports
|
||||
return code + `\nexport { render, staticRenderFns }`
|
||||
}
|
||||
|
||||
function pad (source) {
|
||||
return source
|
||||
.split(/\r?\n/)
|
||||
.map(line => ` ${line}`)
|
||||
.join('\n')
|
||||
}
|
||||
+161
@@ -0,0 +1,161 @@
|
||||
const qs = require('querystring')
|
||||
const RuleSet = require('webpack/lib/RuleSet')
|
||||
|
||||
const id = 'vue-loader-plugin'
|
||||
const NS = 'vue-loader'
|
||||
|
||||
class VueLoaderPlugin {
|
||||
apply (compiler) {
|
||||
// add NS marker so that the loader can detect and report missing plugin
|
||||
if (compiler.hooks) {
|
||||
// webpack 4
|
||||
compiler.hooks.compilation.tap(id, compilation => {
|
||||
const normalModuleLoader = compilation.hooks.normalModuleLoader
|
||||
normalModuleLoader.tap(id, loaderContext => {
|
||||
loaderContext[NS] = true
|
||||
})
|
||||
})
|
||||
} else {
|
||||
// webpack < 4
|
||||
compiler.plugin('compilation', compilation => {
|
||||
compilation.plugin('normal-module-loader', loaderContext => {
|
||||
loaderContext[NS] = true
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
// use webpack's RuleSet utility to normalize user rules
|
||||
const rawRules = compiler.options.module.rules
|
||||
const { rules } = new RuleSet(rawRules)
|
||||
|
||||
// find the rule that applies to vue files
|
||||
let vueRuleIndex = rawRules.findIndex(createMatcher(`foo.vue`))
|
||||
if (vueRuleIndex < 0) {
|
||||
vueRuleIndex = rawRules.findIndex(createMatcher(`foo.vue.html`))
|
||||
}
|
||||
const vueRule = rules[vueRuleIndex]
|
||||
|
||||
if (!vueRule) {
|
||||
throw new Error(
|
||||
`[VueLoaderPlugin Error] No matching rule for .vue files found.\n` +
|
||||
`Make sure there is at least one root-level rule that matches .vue or .vue.html files.`
|
||||
)
|
||||
}
|
||||
|
||||
if (vueRule.oneOf) {
|
||||
throw new Error(
|
||||
`[VueLoaderPlugin Error] vue-loader 15 currently does not support vue rules with oneOf.`
|
||||
)
|
||||
}
|
||||
|
||||
// get the normlized "use" for vue files
|
||||
const vueUse = vueRule.use
|
||||
// get vue-loader options
|
||||
const vueLoaderUseIndex = vueUse.findIndex(u => {
|
||||
return /^vue-loader|(\/|\\|@)vue-loader/.test(u.loader)
|
||||
})
|
||||
|
||||
if (vueLoaderUseIndex < 0) {
|
||||
throw new Error(
|
||||
`[VueLoaderPlugin Error] No matching use for vue-loader is found.\n` +
|
||||
`Make sure the rule matching .vue files include vue-loader in its use.`
|
||||
)
|
||||
}
|
||||
|
||||
// make sure vue-loader options has a known ident so that we can share
|
||||
// options by reference in the template-loader by using a ref query like
|
||||
// template-loader??vue-loader-options
|
||||
const vueLoaderUse = vueUse[vueLoaderUseIndex]
|
||||
vueLoaderUse.ident = 'vue-loader-options'
|
||||
vueLoaderUse.options = vueLoaderUse.options || {}
|
||||
|
||||
// for each user rule (expect the vue rule), create a cloned rule
|
||||
// that targets the corresponding language blocks in *.vue files.
|
||||
const clonedRules = rules
|
||||
.filter(r => r !== vueRule)
|
||||
.map(cloneRule)
|
||||
|
||||
// global pitcher (responsible for injecting template compiler loader & CSS
|
||||
// post loader)
|
||||
const pitcher = {
|
||||
loader: require.resolve('./loaders/pitcher'),
|
||||
resourceQuery: query => {
|
||||
const parsed = qs.parse(query.slice(1))
|
||||
return parsed.vue != null
|
||||
},
|
||||
options: {
|
||||
cacheDirectory: vueLoaderUse.options.cacheDirectory,
|
||||
cacheIdentifier: vueLoaderUse.options.cacheIdentifier
|
||||
}
|
||||
}
|
||||
|
||||
// replace original rules
|
||||
compiler.options.module.rules = [
|
||||
pitcher,
|
||||
...clonedRules,
|
||||
...rules
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
function createMatcher (fakeFile) {
|
||||
return (rule, i) => {
|
||||
// #1201 we need to skip the `include` check when locating the vue rule
|
||||
const clone = Object.assign({}, rule)
|
||||
delete clone.include
|
||||
const normalized = RuleSet.normalizeRule(clone, {}, '')
|
||||
return (
|
||||
!rule.enforce &&
|
||||
normalized.resource &&
|
||||
normalized.resource(fakeFile)
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
function cloneRule (rule) {
|
||||
const { resource, resourceQuery } = rule
|
||||
// Assuming `test` and `resourceQuery` tests are executed in series and
|
||||
// synchronously (which is true based on RuleSet's implementation), we can
|
||||
// save the current resource being matched from `test` so that we can access
|
||||
// it in `resourceQuery`. This ensures when we use the normalized rule's
|
||||
// resource check, include/exclude are matched correctly.
|
||||
let currentResource
|
||||
const res = Object.assign({}, rule, {
|
||||
resource: {
|
||||
test: resource => {
|
||||
currentResource = resource
|
||||
return true
|
||||
}
|
||||
},
|
||||
resourceQuery: query => {
|
||||
const parsed = qs.parse(query.slice(1))
|
||||
if (parsed.vue == null) {
|
||||
return false
|
||||
}
|
||||
if (resource && parsed.lang == null) {
|
||||
return false
|
||||
}
|
||||
const fakeResourcePath = `${currentResource}.${parsed.lang}`
|
||||
if (resource && !resource(fakeResourcePath)) {
|
||||
return false
|
||||
}
|
||||
if (resourceQuery && !resourceQuery(query)) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
}
|
||||
})
|
||||
|
||||
if (rule.rules) {
|
||||
res.rules = rule.rules.map(cloneRule)
|
||||
}
|
||||
|
||||
if (rule.oneOf) {
|
||||
res.oneOf = rule.oneOf.map(cloneRule)
|
||||
}
|
||||
|
||||
return res
|
||||
}
|
||||
|
||||
VueLoaderPlugin.NS = NS
|
||||
module.exports = VueLoaderPlugin
|
||||
+198
@@ -0,0 +1,198 @@
|
||||
const qs = require('querystring')
|
||||
const id = 'vue-loader-plugin'
|
||||
const NS = 'vue-loader'
|
||||
const BasicEffectRulePlugin = require('webpack/lib/rules/BasicEffectRulePlugin')
|
||||
const BasicMatcherRulePlugin = require('webpack/lib/rules/BasicMatcherRulePlugin')
|
||||
const RuleSetCompiler = require('webpack/lib/rules/RuleSetCompiler')
|
||||
const UseEffectRulePlugin = require('webpack/lib/rules/UseEffectRulePlugin')
|
||||
|
||||
const ruleSetCompiler = new RuleSetCompiler([
|
||||
new BasicMatcherRulePlugin('test', 'resource'),
|
||||
new BasicMatcherRulePlugin('include', 'resource'),
|
||||
new BasicMatcherRulePlugin('exclude', 'resource', true),
|
||||
new BasicMatcherRulePlugin('resource'),
|
||||
new BasicMatcherRulePlugin('conditions'),
|
||||
new BasicMatcherRulePlugin('resourceQuery'),
|
||||
new BasicMatcherRulePlugin('realResource'),
|
||||
new BasicMatcherRulePlugin('issuer'),
|
||||
new BasicMatcherRulePlugin('compiler'),
|
||||
new BasicEffectRulePlugin('type'),
|
||||
new BasicEffectRulePlugin('sideEffects'),
|
||||
new BasicEffectRulePlugin('parser'),
|
||||
new BasicEffectRulePlugin('resolve'),
|
||||
new UseEffectRulePlugin()
|
||||
])
|
||||
|
||||
class VueLoaderPlugin {
|
||||
apply (compiler) {
|
||||
// add NS marker so that the loader can detect and report missing plugin
|
||||
compiler.hooks.compilation.tap(id, compilation => {
|
||||
const normalModuleLoader = require('webpack/lib/NormalModule').getCompilationHooks(compilation).loader
|
||||
normalModuleLoader.tap(id, loaderContext => {
|
||||
loaderContext[NS] = true
|
||||
})
|
||||
})
|
||||
|
||||
const rules = compiler.options.module.rules
|
||||
let rawVueRules
|
||||
let vueRules = []
|
||||
|
||||
for (const rawRule of rules) {
|
||||
// skip the `include` check when locating the vue rule
|
||||
const clonedRawRule = Object.assign({}, rawRule)
|
||||
delete clonedRawRule.include
|
||||
|
||||
const ruleSet = ruleSetCompiler.compile([{
|
||||
rules: [clonedRawRule]
|
||||
}])
|
||||
vueRules = ruleSet.exec({
|
||||
resource: 'foo.vue'
|
||||
})
|
||||
|
||||
if (!vueRules.length) {
|
||||
vueRules = ruleSet.exec({
|
||||
resource: 'foo.vue.html'
|
||||
})
|
||||
}
|
||||
if (vueRules.length > 0) {
|
||||
if (rawRule.oneOf) {
|
||||
throw new Error(
|
||||
`[VueLoaderPlugin Error] vue-loader 15 currently does not support vue rules with oneOf.`
|
||||
)
|
||||
}
|
||||
rawVueRules = rawRule
|
||||
break
|
||||
}
|
||||
}
|
||||
if (!vueRules.length) {
|
||||
throw new Error(
|
||||
`[VueLoaderPlugin Error] No matching rule for .vue files found.\n` +
|
||||
`Make sure there is at least one root-level rule that matches .vue or .vue.html files.`
|
||||
)
|
||||
}
|
||||
|
||||
// get the normlized "use" for vue files
|
||||
const vueUse = vueRules.filter(rule => rule.type === 'use').map(rule => rule.value)
|
||||
|
||||
// get vue-loader options
|
||||
const vueLoaderUseIndex = vueUse.findIndex(u => {
|
||||
return /^vue-loader|(\/|\\|@)vue-loader/.test(u.loader)
|
||||
})
|
||||
|
||||
if (vueLoaderUseIndex < 0) {
|
||||
throw new Error(
|
||||
`[VueLoaderPlugin Error] No matching use for vue-loader is found.\n` +
|
||||
`Make sure the rule matching .vue files include vue-loader in its use.`
|
||||
)
|
||||
}
|
||||
|
||||
// make sure vue-loader options has a known ident so that we can share
|
||||
// options by reference in the template-loader by using a ref query like
|
||||
// template-loader??vue-loader-options
|
||||
const vueLoaderUse = vueUse[vueLoaderUseIndex]
|
||||
vueLoaderUse.ident = 'vue-loader-options'
|
||||
vueLoaderUse.options = vueLoaderUse.options || {}
|
||||
|
||||
// for each user rule (expect the vue rule), create a cloned rule
|
||||
// that targets the corresponding language blocks in *.vue files.
|
||||
const refs = new Map()
|
||||
const clonedRules = rules
|
||||
.filter(r => r !== rawVueRules)
|
||||
.map((rawRule) => cloneRule(rawRule, refs))
|
||||
|
||||
// fix conflict with config.loader and config.options when using config.use
|
||||
delete rawVueRules.loader
|
||||
delete rawVueRules.options
|
||||
rawVueRules.use = vueUse
|
||||
|
||||
// global pitcher (responsible for injecting template compiler loader & CSS
|
||||
// post loader)
|
||||
const pitcher = {
|
||||
loader: require.resolve('./loaders/pitcher'),
|
||||
resourceQuery: query => {
|
||||
const parsed = qs.parse(query.slice(1))
|
||||
return parsed.vue != null
|
||||
},
|
||||
options: {
|
||||
cacheDirectory: vueLoaderUse.options.cacheDirectory,
|
||||
cacheIdentifier: vueLoaderUse.options.cacheIdentifier
|
||||
}
|
||||
}
|
||||
|
||||
// replace original rules
|
||||
compiler.options.module.rules = [
|
||||
pitcher,
|
||||
...clonedRules,
|
||||
...rules
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
let uid = 0
|
||||
function cloneRule (rawRule, refs) {
|
||||
const rules = ruleSetCompiler.compileRules(`clonedRuleSet-${++uid}`, [{
|
||||
rules: [rawRule]
|
||||
}], refs)
|
||||
let currentResource
|
||||
|
||||
const conditions = rules[0].rules
|
||||
.map(rule => rule.conditions)
|
||||
// shallow flat
|
||||
.reduce((prev, next) => prev.concat(next), [])
|
||||
|
||||
// do not process rule with enforce
|
||||
if (!rawRule.enforce) {
|
||||
const ruleUse = rules[0].rules
|
||||
.map(rule => rule.effects
|
||||
.filter(effect => effect.type === 'use')
|
||||
.map(effect => effect.value)
|
||||
)
|
||||
// shallow flat
|
||||
.reduce((prev, next) => prev.concat(next), [])
|
||||
|
||||
// fix conflict with config.loader and config.options when using config.use
|
||||
delete rawRule.loader
|
||||
delete rawRule.options
|
||||
rawRule.use = ruleUse
|
||||
}
|
||||
|
||||
const res = Object.assign({}, rawRule, {
|
||||
resource: resources => {
|
||||
currentResource = resources
|
||||
return true
|
||||
},
|
||||
resourceQuery: query => {
|
||||
const parsed = qs.parse(query.slice(1))
|
||||
if (parsed.vue == null) {
|
||||
return false
|
||||
}
|
||||
if (!conditions) {
|
||||
return false
|
||||
}
|
||||
const fakeResourcePath = `${currentResource}.${parsed.lang}`
|
||||
for (const condition of conditions) {
|
||||
// add support for resourceQuery
|
||||
const request = condition.property === 'resourceQuery' ? query : fakeResourcePath
|
||||
if (condition && !condition.fn(request)) {
|
||||
return false
|
||||
}
|
||||
}
|
||||
return true
|
||||
}
|
||||
})
|
||||
|
||||
delete res.test
|
||||
|
||||
if (rawRule.rules) {
|
||||
res.rules = rawRule.rules.map(rule => cloneRule(rule, refs))
|
||||
}
|
||||
|
||||
if (rawRule.oneOf) {
|
||||
res.oneOf = rawRule.oneOf.map(rule => cloneRule(rule, refs))
|
||||
}
|
||||
|
||||
return res
|
||||
}
|
||||
|
||||
VueLoaderPlugin.NS = NS
|
||||
module.exports = VueLoaderPlugin
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
const webpack = require('webpack')
|
||||
let VueLoaderPlugin = null
|
||||
|
||||
if (webpack.version && webpack.version[0] > 4) {
|
||||
// webpack5 and upper
|
||||
VueLoaderPlugin = require('./plugin-webpack5')
|
||||
} else {
|
||||
// webpack4 and lower
|
||||
VueLoaderPlugin = require('./plugin-webpack4')
|
||||
}
|
||||
|
||||
module.exports = VueLoaderPlugin
|
||||
+93
@@ -0,0 +1,93 @@
|
||||
/* globals __VUE_SSR_CONTEXT__ */
|
||||
|
||||
// IMPORTANT: Do NOT use ES2015 features in this file (except for modules).
|
||||
// This module is a runtime utility for cleaner component module output and will
|
||||
// be included in the final webpack user bundle.
|
||||
|
||||
export default function normalizeComponent (
|
||||
scriptExports,
|
||||
render,
|
||||
staticRenderFns,
|
||||
functionalTemplate,
|
||||
injectStyles,
|
||||
scopeId,
|
||||
moduleIdentifier, /* server only */
|
||||
shadowMode /* vue-cli only */
|
||||
) {
|
||||
// Vue.extend constructor export interop
|
||||
var options = typeof scriptExports === 'function'
|
||||
? scriptExports.options
|
||||
: scriptExports
|
||||
|
||||
// render functions
|
||||
if (render) {
|
||||
options.render = render
|
||||
options.staticRenderFns = staticRenderFns
|
||||
options._compiled = true
|
||||
}
|
||||
|
||||
// functional template
|
||||
if (functionalTemplate) {
|
||||
options.functional = true
|
||||
}
|
||||
|
||||
// scopedId
|
||||
if (scopeId) {
|
||||
options._scopeId = 'data-v-' + scopeId
|
||||
}
|
||||
|
||||
var hook
|
||||
if (moduleIdentifier) { // server build
|
||||
hook = function (context) {
|
||||
// 2.3 injection
|
||||
context =
|
||||
context || // cached call
|
||||
(this.$vnode && this.$vnode.ssrContext) || // stateful
|
||||
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) // functional
|
||||
// 2.2 with runInNewContext: true
|
||||
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
|
||||
context = __VUE_SSR_CONTEXT__
|
||||
}
|
||||
// inject component styles
|
||||
if (injectStyles) {
|
||||
injectStyles.call(this, context)
|
||||
}
|
||||
// register component module identifier for async chunk inferrence
|
||||
if (context && context._registeredComponents) {
|
||||
context._registeredComponents.add(moduleIdentifier)
|
||||
}
|
||||
}
|
||||
// used by ssr in case component is cached and beforeCreate
|
||||
// never gets called
|
||||
options._ssrRegister = hook
|
||||
} else if (injectStyles) {
|
||||
hook = shadowMode
|
||||
? function () { injectStyles.call(this, this.$root.$options.shadowRoot) }
|
||||
: injectStyles
|
||||
}
|
||||
|
||||
if (hook) {
|
||||
if (options.functional) {
|
||||
// for template-only hot-reload because in that case the render fn doesn't
|
||||
// go through the normalizer
|
||||
options._injectStyles = hook
|
||||
// register for functional component in vue file
|
||||
var originalRender = options.render
|
||||
options.render = function renderWithStyleInjection (h, context) {
|
||||
hook.call(context)
|
||||
return originalRender(h, context)
|
||||
}
|
||||
} else {
|
||||
// inject component registration as beforeCreate hook
|
||||
var existing = options.beforeCreate
|
||||
options.beforeCreate = existing
|
||||
? [].concat(existing, hook)
|
||||
: [hook]
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
exports: scriptExports,
|
||||
options: options
|
||||
}
|
||||
}
|
||||
+57
@@ -0,0 +1,57 @@
|
||||
module.exports = function selectBlock (
|
||||
descriptor,
|
||||
loaderContext,
|
||||
query,
|
||||
appendExtension
|
||||
) {
|
||||
// template
|
||||
if (query.type === `template`) {
|
||||
if (appendExtension) {
|
||||
loaderContext.resourcePath += '.' + (descriptor.template.lang || 'html')
|
||||
}
|
||||
loaderContext.callback(
|
||||
null,
|
||||
descriptor.template.content,
|
||||
descriptor.template.map
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
// script
|
||||
if (query.type === `script`) {
|
||||
if (appendExtension) {
|
||||
loaderContext.resourcePath += '.' + (descriptor.script.lang || 'js')
|
||||
}
|
||||
loaderContext.callback(
|
||||
null,
|
||||
descriptor.script.content,
|
||||
descriptor.script.map
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
// styles
|
||||
if (query.type === `style` && query.index != null) {
|
||||
const style = descriptor.styles[query.index]
|
||||
if (appendExtension) {
|
||||
loaderContext.resourcePath += '.' + (style.lang || 'css')
|
||||
}
|
||||
loaderContext.callback(
|
||||
null,
|
||||
style.content,
|
||||
style.map
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
// custom
|
||||
if (query.type === 'custom' && query.index != null) {
|
||||
const block = descriptor.customBlocks[query.index]
|
||||
loaderContext.callback(
|
||||
null,
|
||||
block.content,
|
||||
block.map
|
||||
)
|
||||
return
|
||||
}
|
||||
}
|
||||
+131
@@ -0,0 +1,131 @@
|
||||
{
|
||||
"_from": "vue-loader@*",
|
||||
"_id": "vue-loader@15.9.1",
|
||||
"_inBundle": false,
|
||||
"_integrity": "sha512-IaPU2KOPjs/QjMlxFs/TiTtQUSbftQ7lsAvoxe21rtcQohsMhx+1AltXCNhZIpIn46PtODiAgz+o8RbMpKtmJw==",
|
||||
"_location": "/vue-loader",
|
||||
"_phantomChildren": {},
|
||||
"_requested": {
|
||||
"type": "range",
|
||||
"registry": true,
|
||||
"raw": "vue-loader@*",
|
||||
"name": "vue-loader",
|
||||
"escapedName": "vue-loader",
|
||||
"rawSpec": "*",
|
||||
"saveSpec": null,
|
||||
"fetchSpec": "*"
|
||||
},
|
||||
"_requiredBy": [
|
||||
"#DEV:/"
|
||||
],
|
||||
"_resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.1.tgz",
|
||||
"_shasum": "bd2ab8f3d281e51d7b81d15390a58424d142243e",
|
||||
"_spec": "vue-loader@*",
|
||||
"_where": "O:\\zero\\zero.Web",
|
||||
"author": {
|
||||
"name": "Evan You"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/vuejs/vue-loader/issues"
|
||||
},
|
||||
"bundleDependencies": false,
|
||||
"dependencies": {
|
||||
"@vue/component-compiler-utils": "^3.1.0",
|
||||
"hash-sum": "^1.0.2",
|
||||
"loader-utils": "^1.1.0",
|
||||
"vue-hot-reload-api": "^2.3.0",
|
||||
"vue-style-loader": "^4.1.0"
|
||||
},
|
||||
"deprecated": false,
|
||||
"description": "Vue single-file component loader for Webpack",
|
||||
"devDependencies": {
|
||||
"@types/webpack": "^4.4.27",
|
||||
"babel-core": "^6.26.0",
|
||||
"babel-loader": "^7.1.4",
|
||||
"babel-preset-env": "^1.6.1",
|
||||
"cache-loader": "^2.0.1",
|
||||
"conventional-changelog-cli": "^1.3.22",
|
||||
"css-loader": "^1.0.0",
|
||||
"eslint": "^4.19.0",
|
||||
"eslint-plugin-vue-libs": "^2.1.0",
|
||||
"file-loader": "^1.1.11",
|
||||
"html-webpack-plugin": "4.0.0-beta.14",
|
||||
"javascript-stringify": "^1.6.0",
|
||||
"jest": "^23.5.0",
|
||||
"jsdom": "^11.6.2",
|
||||
"json": "^9.0.6",
|
||||
"lint-staged": "^7.0.0",
|
||||
"markdown-loader": "^2.0.2",
|
||||
"memfs": "^3.1.2",
|
||||
"mini-css-extract-plugin": "^0.4.1",
|
||||
"node-sass": "^4.7.2",
|
||||
"normalize-newline": "^3.0.0",
|
||||
"null-loader": "^0.1.1",
|
||||
"postcss-loader": "^2.1.2",
|
||||
"pug": "^2.0.1",
|
||||
"pug-plain-loader": "^1.0.0",
|
||||
"raw-loader": "^0.5.1",
|
||||
"sass-loader": "^6.0.7",
|
||||
"source-map": "^0.5.0",
|
||||
"stylus": "^0.54.5",
|
||||
"stylus-loader": "^3.0.2",
|
||||
"sugarss": "^1.0.1",
|
||||
"ts-loader": "^4.2.0",
|
||||
"typescript": "^2.8.3",
|
||||
"url-loader": "^1.0.1",
|
||||
"vue": "^2.5.16",
|
||||
"vue-server-renderer": "^2.5.16",
|
||||
"vue-template-compiler": "^2.5.16",
|
||||
"vuepress": "^0.14.2",
|
||||
"vuepress-theme-vue": "^1.1.0",
|
||||
"webpack": "^4.1.0",
|
||||
"webpack-cli": "^3.2.0",
|
||||
"webpack-dev-server": "^3.1.1",
|
||||
"webpack-merge": "^4.1.2",
|
||||
"yorkie": "^1.0.3"
|
||||
},
|
||||
"gitHooks": {
|
||||
"pre-commit": "lint-staged"
|
||||
},
|
||||
"homepage": "https://github.com/vuejs/vue-loader",
|
||||
"license": "MIT",
|
||||
"lint-staged": {
|
||||
"lib/**/*.js": [
|
||||
"eslint --fix",
|
||||
"git add"
|
||||
],
|
||||
"test/**/*.js": [
|
||||
"eslint --fix",
|
||||
"git add"
|
||||
]
|
||||
},
|
||||
"main": "lib/index.js",
|
||||
"name": "vue-loader",
|
||||
"peerDependencies": {
|
||||
"css-loader": "*",
|
||||
"webpack": "^3.0.0 || ^4.1.0 || ^5.0.0-0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"cache-loader": {
|
||||
"optional": true
|
||||
},
|
||||
"vue-template-compiler": {
|
||||
"optional": true
|
||||
}
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/vuejs/vue-loader.git"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "webpack --config example/webpack.config.js --hide-modules",
|
||||
"dev": "webpack-dev-server --config example/webpack.config.js --inline --hot",
|
||||
"docs": "vuepress dev docs",
|
||||
"docs:build": "vuepress build docs",
|
||||
"lint": "eslint lib test --fix",
|
||||
"prepublishOnly": "conventional-changelog -p angular -r 2 -i CHANGELOG.md -s",
|
||||
"test": "yarn lint && jest --env node"
|
||||
},
|
||||
"typings": "lib/index.d.ts",
|
||||
"version": "15.9.1"
|
||||
}
|
||||
Reference in New Issue
Block a user