diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..c06df4d --- /dev/null +++ b/.babelrc @@ -0,0 +1,18 @@ +{ + "presets": [ + ["env", { + "modules": false, + "targets": { + "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] + } + }], + "stage-2" + ], + "plugins": ["transform-runtime"], + "env": { + "test": { + "presets": ["env", "stage-2"], + "plugins": ["istanbul"] + } + } +} diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..9d08a1a --- /dev/null +++ b/.editorconfig @@ -0,0 +1,9 @@ +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..aafb909 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,37 @@ +// http://eslint.org/docs/user-guide/configuring + +module.exports = { + root: true, + parser: 'babel-eslint', + parserOptions: { + sourceType: 'module' + }, + env: { + browser: false, + node: true, + es6: true + }, + // https://github.com/standard/standard/blob/master/docs/RULES-en.md + extends: 'standard', + // required to lint *.vue files + plugins: [ + 'html' + ], + // add your custom rules here + 'rules': { + // allow paren-less arrow functions + 'arrow-parens': 0, + // allow async-await + 'generator-star-spacing': 0, + // allow debugger during development + 'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0 + }, + globals: { + App: true, + Page: true, + wx: true, + getApp: true, + getPage: true, + requirePlugin: true + } +} diff --git a/README.md b/README.md new file mode 100644 index 0000000..6a807d8 --- /dev/null +++ b/README.md @@ -0,0 +1,22 @@ +# webpack-mpvue-plugin + +> mpvue 资源路径解析插件 + +## 使用示例: + +```js +const MpvuePlugin = require('webpack-mpvue-asset-plugin') +// webpack config +{ + entry: [], + output: { + path: path.resolve(__dirname, 'dist'), + filename: 'foo.bundle.js' + }, + plugins: [ + new MpvuePlugin() + ] +}; +``` + +bug 或者交流建议等请反馈到 [mpvue/issues](https://github.com/Meituan-Dianping/mpvue/issues)。 diff --git a/index.js b/index.js index 12b5b58..c7f8bd0 100644 --- a/index.js +++ b/index.js @@ -1,40 +1,33 @@ +const path = require('path'); +const upath = require('upath'); +const relative = require('relative'); + function MpvuePlugin() {} MpvuePlugin.prototype.apply = function(compiler) { - const {options: {entry, plugins}} = compiler; compiler.plugin('emit', function(compilation, callback) { - let commonsChunkNames = []; - // 获取所有的 chunk name - plugins.forEach(item => { - let { chunkNames } = item; - if (item.constructor.name === 'CommonsChunkPlugin' && chunkNames) { - commonsChunkNames = commonsChunkNames.concat(chunkNames); - } - }) - compilation.chunks.forEach(commonChunk => { - const { files, chunks: childChunks, name } = commonChunk; - let commonWxssFile = files.find(item => item.endsWith('.wxss')); - - if (commonsChunkNames.indexOf(name) > -1 && commonWxssFile) { - childChunks.forEach(item => { - let wxssFile = item.files.find(item => item.endsWith('.wxss')); - if (item.name === 'app' && wxssFile) { // 过滤 app - return; - } - try { - if (compilation.assets[wxssFile]) { - let wxss = compilation.assets[wxssFile].source(); - wxss = `@import "/${commonWxssFile}";\n${wxss}`; - compilation.assets[wxssFile].source = () => wxss; + Object.keys(compilation.entrypoints).forEach(key => { + const entry = compilation.entrypoints[key]; + const { chunks } = entry; + const entryChunk = chunks.pop(); + entryChunk.files.forEach(filePath => { + const extname = path.extname(filePath); + let content = compilation.assets[filePath].source(); + chunks.reverse().forEach(chunk => { + chunk.files.forEach(childFile => { + if (path.extname(childFile) === extname && compilation.assets[filePath]) { + const relativePath = upath.normalize(relative(filePath, childFile)) + content = extname === '.wxss' ? + `@import "${relativePath}";\n${content}` + : `require("${relativePath}");\n${content}`; } - } catch (error) { - console.error(error, wxssFile) - } + }) + compilation.assets[filePath].source = () => content; }) - } - }); + }) + }) callback(); }); }; -module.exports = MpvuePlugin; \ No newline at end of file +module.exports = MpvuePlugin; diff --git a/package.json b/package.json index 8e00ba1..3fc1b27 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "webpack-mpvue-asset-plugin", - "version": "0.0.2", + "version": "0.1.0", "main": "index.js", "directories": { "lib": "lib" @@ -22,5 +22,9 @@ "url": "https://github.com/mpvue/webpack-mpvue-asset-plugin/issues" }, "homepage": "https://github.com/mpvue/webpack-mpvue-asset-plugin#readme", - "description": "" + "description": "", + "dependencies": { + "relative": "^3.0.2", + "upath": "^1.1.0" + } } diff --git a/yarn.lock b/yarn.lock new file mode 100644 index 0000000..dffca42 --- /dev/null +++ b/yarn.lock @@ -0,0 +1,19 @@ +# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. +# yarn lockfile v1 + + +isarray@1.0.0: + version "1.0.0" + resolved "http://r.npm.sankuai.com/isarray/download/isarray-1.0.0.tgz#bb935d48582cba168c06834957a54a3e07124f11" + +isobject@^2.0.0: + version "2.1.0" + resolved "http://r.npm.sankuai.com/isobject/download/isobject-2.1.0.tgz#f065561096a3f1da2ef46272f815c840d87e0c89" + dependencies: + isarray "1.0.0" + +relative@^3.0.2: + version "3.0.2" + resolved "http://r.npm.sankuai.com/relative/download/relative-3.0.2.tgz#0dcd8ec54a5d35a3c15e104503d65375b5a5367f" + dependencies: + isobject "^2.0.0"