Skip to content

Commit 15e7455

Browse files
author
v_zhihzhou
committed
Webpack 4 Support
1 parent c6e261c commit 15e7455

File tree

8 files changed

+36
-18
lines changed

8 files changed

+36
-18
lines changed

README.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
# mpvue-loader
22

3-
>Webpack loader for mpvue components
3+
>Webpack4 loader for mpvue components
44
5-
本仓库是 fork 自 [vue-loader](https://github.com/vuejs/vue-loader) 修改而来,主要为 webpack 打包 mpvue components 提供能力。
5+
本仓库是 fork 自 [mpvue-loader](http://mpvue.com/build/mpvue-loader) 修改而来,主要为 webpack4 打包 mpvue components 提供能力。
66

77
更多详细文档请查阅 [mpvue-loader](http://mpvue.com/build/mpvue-loader)
88

99
bug 或者交流建议等请反馈到 [mpvue/issues](https://github.com/Meituan-Dianping/mpvue/issues)
10+
11+
关于webpack4的可以在这里反馈 [mpvue/issues](https://github.com/bugkun/mpvue/issues)

lib/loader.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,9 +66,10 @@ module.exports = function (content) {
6666

6767
var loaderContext = this
6868
var query = loaderUtils.getOptions(this) || {}
69+
// enhance: 兼容新版webpack4,options在this._compiler中
6970
var options = Object.assign({
7071
esModule: true
71-
}, this.options.vue, this.vue, query)
72+
}, this._compiler.options.vue, this.vue, query)
7273

7374
// disable esModule in inject mode
7475
// because import/export must be top-level
@@ -77,7 +78,8 @@ module.exports = function (content) {
7778
}
7879

7980
// #824 avoid multiple webpack runs complaining about unknown option
80-
Object.defineProperty(this.options, '__vueOptions__', {
81+
// enhance: 兼容新版webpack4,options在this._compiler中
82+
Object.defineProperty(this._compiler.options, '__vueOptions__', {
8183
value: options,
8284
enumerable: false,
8385
configurable: true
@@ -87,7 +89,8 @@ module.exports = function (content) {
8789
var filePath = this.resourcePath
8890
var fileName = path.basename(filePath)
8991

90-
var context = (this._compiler && this._compiler.context) || this.options.context || process.cwd()
92+
// enhance: 兼容新版webpack4,options在this._compiler中
93+
var context = (this._compiler && this._compiler.context) || this._compiler.options.context || process.cwd()
9194
var moduleId = 'data-v-' + genId(filePath, context, options.hashKey)
9295
var shortFilePath = path.relative(context, filePath).replace(/^(\.\.\/)+/, '')
9396

lib/mp-compiler/index.js

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ function compileMPML (compiled, html, options) {
8787
emitError: this.emitError,
8888
emitFile: this.emitFile,
8989
resourcePath: this.resourcePath,
90-
context: this.options.context,
90+
context: this._compiler.options.context,
9191
rootComponent: null,
9292
compiled, html,
9393
fileExt
@@ -98,7 +98,8 @@ function compileMPML (compiled, html, options) {
9898
// 针对 .vue 单文件的脚本逻辑的处理
9999
// 处理出当前单文件组件的子组件依赖
100100
function compileMPScript (script, mpOptioins, moduleId) {
101-
const { resourcePath, options, resolve, context } = this
101+
// enhance: 兼容新版webpack4,options在this._compiler中
102+
const { resourcePath, _compiler: { options }, resolve, context } = this
102103
const babelrc = getBabelrc(mpOptioins.globalBabelrc)
103104

104105
let scriptContent = script.content
@@ -140,7 +141,8 @@ function compileMPScript (script, mpOptioins, moduleId) {
140141
// checkMPEntry 针对 entry main.js 的入口处理: 编译出 app, page 的入口js、mpml、json
141142
let globalComponents
142143
function compileMP (content, mpOptioins) {
143-
const { resourcePath, emitFile, resolve, context, options } = this
144+
// enhance: 兼容新版webpack4,options在this._compiler中
145+
const { resourcePath, emitFile, resolve, context, _compiler: { options }} = this
144146
const fileInfo = resolveTarget(resourcePath, options.entry)
145147
cacheFileInfo(resourcePath, fileInfo)
146148
const { isApp, isPage } = fileInfo
@@ -193,7 +195,8 @@ function compileMP (content, mpOptioins) {
193195
resolve(context, rootComponent, (err, rootComponentSrc) => {
194196
if (err) return
195197
// 这儿需要搞定 根组件的 路径
196-
createPageMPML(emitFile, resourcePath, rootComponentSrc, this.options.context, mpOptioins.fileExt)
198+
// enhance: 兼容新版webpack4,options在this._compiler中
199+
createPageMPML(emitFile, resourcePath, rootComponentSrc, this._compiler.options.context, mpOptioins.fileExt)
197200
})
198201
}
199202
}

lib/parser.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
var compiler = require('mpvue-template-compiler')
2-
var cache = require('lru-cache')(100)
2+
var LruCache = require('lru-cache')
3+
// enhance: 修复lru-cache在某些版本下的Node.js中可能会报错的问题
4+
var cache = new LruCache(100)
35
var hash = require('hash-sum')
46
var SourceMapGenerator = require('source-map').SourceMapGenerator
57

lib/selector.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@ var { defaultPart } = require('./mp-compiler/util')
1010
module.exports = function (content) {
1111
this.cacheable()
1212
var query = loaderUtils.getOptions(this) || {}
13-
var context = (this._compiler && this._compiler.context) || this.options.context || process.cwd()
13+
// enhance: 兼容新版webpack4,options在this._compiler中
14+
var context = (this._compiler && this._compiler.context) || this._compiler.options.context || process.cwd()
1415
var filename = path.relative(context, this.resourcePath).replace(/\..+$/, '.vue')
1516
var parts = parse(content, filename, this.sourceMap)
1617
var part = parts[query.type]

lib/style-compiler/index.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@ module.exports = function (css, map) {
1010
var cb = this.async()
1111

1212
var query = loaderUtils.getOptions(this) || {}
13-
var vueOptions = this.options.__vueOptions__
13+
// enhance: 兼容新版webpack4,options在this._compiler中
14+
var vueOptions = this._compiler.options.__vueOptions__
1415

1516
if (!vueOptions) {
1617
if (query.hasInlineConfig) {
@@ -22,7 +23,8 @@ module.exports = function (css, map) {
2223
`\n See http://vue-loader.vuejs.org/en/features/postcss.html#using-a-config-file for more details.\n`
2324
)
2425
}
25-
vueOptions = Object.assign({}, this.options.vue, this.vue)
26+
// enhance: 兼容新版webpack4,options在this._compiler中
27+
vueOptions = Object.assign({}, this._compiler.options.vue, this.vue)
2628
}
2729

2830
loadPostcssConfig(this, vueOptions.postcss).then(config => {

lib/template-compiler/index.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,16 @@ module.exports = function (html) {
1414
this.cacheable()
1515
var isServer = this.target === 'node'
1616
var isProduction = this.minimize || process.env.NODE_ENV === 'production'
17-
var vueOptions = this.options.__vueOptions__ || {}
17+
// enhance: 兼容新版webpack4,options在this._compiler中
18+
var vueOptions = this._compiler.options.__vueOptions__ || {}
1819
var options = loaderUtils.getOptions(this) || {}
1920

2021
var defaultModules = [transformRequire(options.transformToRequire, {
21-
outputPath: this.options.output.path,
22+
// enhance: 兼容新版webpack4,options在this._compiler中
23+
outputPath: this._compiler.options.output.path,
2224
resourcePath: this.resourcePath,
23-
context: this.options.context
25+
// enhance: 兼容新版webpack4,options在this._compiler中
26+
context: this._compiler.options.context
2427
})]
2528

2629
var userModules = vueOptions.compilerModules || options.compilerModules

lib/template-compiler/preprocessor.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,10 @@ module.exports = function (content) {
1616
}
1717

1818
// allow passing options to the template preprocessor via `template` option
19-
if (this.options.__vueOptions__) {
20-
Object.assign(opt, this.options.__vueOptions__.template)
19+
// enhance: 兼容新版webpack4,options在this._compiler中
20+
if (this._compiler.options.__vueOptions__) {
21+
// enhance: 兼容新版webpack4,options在this._compiler中
22+
Object.assign(opt, this._compiler.options.__vueOptions__.template)
2123
}
2224

2325
// for relative includes

0 commit comments

Comments
 (0)