Skip to content

Commit

Permalink
feat: components support
Browse files Browse the repository at this point in the history
  • Loading branch information
yangtianjie committed Jul 31, 2019
1 parent f3921c5 commit 370360d
Show file tree
Hide file tree
Showing 9 changed files with 163 additions and 50 deletions.
3 changes: 2 additions & 1 deletion src/asset.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ module.exports = class Asset {
}

getMeta(key) {
if(key === undefined) return this.__meta;
return this.__meta[key];
}

Expand Down Expand Up @@ -115,4 +116,4 @@ module.exports = class Asset {
del() {
return fse.remove(this.outputFilePath);
}
};
};
56 changes: 46 additions & 10 deletions src/assetManager.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,17 +17,45 @@ module.exports = class AssetManager {
});
}

getAsset(path) {
getAssets(path) {
return this.map[path];
}

findExistAsset(asset) {
if(this.map[asset.path]) {
let index = -1;
const existAssets = this.map[asset.path];
for(let i = 0; i < existAssets.length; i++) {
if(existAssets[i].outputFilePath === asset.outputFilePath) {
index = i;
}
}
return index;
} else {
throw new Error(`This.map[${asset.path}] is undefined`);
}
}

setAsset(asset) {
this.map[asset.path] = asset;
if(this.map[asset.path]) {
let index = this.findExistAsset(asset);
if(index === -1) {
this.map[asset.path].push(asset);
} else {
this.map[asset.path][index] = asset;
}

this.map[asset.path].push(asset);
} else {
this.map[asset.path] = [asset];
}
return asset;
}

removeAsset(asset) {
if (asset) delete this.mpb[asset.path];
if(!this.map[asset.path]) return;
let index = this.findExistAsset(asset);
this.map[asset.path].splice(index, 1);
}

// 尝试添加新的资源文件
Expand All @@ -39,10 +67,15 @@ module.exports = class AssetManager {
asset = new Asset(path, outputPath, meta);
}
if (asset.exists()) {
if (this.getAsset(asset.path) && !this.getAsset(asset.path).beChanged(asset)) {
// 终止接下来处理asset的流程
// console.log(chalk.yellow('[addAsset] 文件没有更改'), asset.path);
return asset;
const existAssets = this.getAssets(asset.path);
if(existAssets) {
for(let existAsset of existAssets) {
if (!existAsset.beChanged(asset) && existAsset.outputFilePath === asset.outputFilePath) {
// 终止接下来处理asset的流程
// console.log(chalk.yellow('[addAsset] 文件没有更改'), asset.path);
return existAsset;
}
}
}
// 更新asset
this.setAsset(asset);
Expand Down Expand Up @@ -92,18 +125,21 @@ module.exports = class AssetManager {
}

emitFile(asset) {
// if(asset.filePath.includes('node_modules') && asset.getMeta('mbp-scan-json-dep')) {
// console.log(asset.getMeta('source'), asset.getMeta('root'));
// }
asset.render(this.mpb).catch((err) => {
console.error(err);
});
}

delAsset(asset) {
// TODO 这里就是单纯去除文件本身，文件所依赖的，和被依赖的有可能悬空，也需要被清除
this.removeAsset();
asset.exists();
this.removeAsset(asset);
return asset.exists();
}

getWatchFiles() {
return Object.keys(this.map).filter((path) => path !== this.mpb.entryPath);
}
};
};
17 changes: 10 additions & 7 deletions src/helper.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,14 +20,17 @@ module.exports = class Helper {
getFilePath(base, filePath) {
// 如果 src 下面 json里面使用了 /aa/xxx 这种 绝对路径，按照微信的解析方式就是相对于 src目录为绝对路径的开始
// 相同的js等都是这个规则，所以这里解析就要按照此规则来，如果是src外的地址，那就要依据dist转换为相对应的地址
if (filePath.includes('@')) {
// if (filePath.includes('@')) {
// const newPath = pathAlias(filePath);
// if (newPath !== filePath) return newPath;
// }
// 如果包含node_modules说明是引用的外部组件直接直接处理文件路径
if(filePath.includes('node_modules')) {
return filePath;
} else if(filePath.includes('@')) {
const newPath = pathAlias(filePath);
if (newPath !== filePath) return newPath;
}
if(filePath.includes(os.homedir())){
return filePath;
}
if (filePath[0] === '/') {
} else if (filePath[0] === '/') {
return path.resolve(this.mpb.config.src, filePath.substr(1));
}
return path.resolve(base, filePath);
Expand All @@ -50,4 +53,4 @@ module.exports = class Helper {
const index = fileName.length - ext.length;
return [fileName.substr(0, index - 1), ext];
}
};
};
34 changes: 26 additions & 8 deletions src/plugin/handleJSDep.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,10 @@ const bresolve = require('browser-resolve');
const resolve = require('resolve');

module.exports = class HandleJSDep {
constructor() {
this.mainPkgPathMap = {};
}

apply(mpb) {
mpb.hooks.beforeEmitFile.tapPromise('HandleJSDep', async (asset) => {
const deps = [];
Expand Down Expand Up @@ -51,17 +55,27 @@ module.exports = class HandleJSDep {
});
}
}

const root = asset.getMeta('root');
// if(root === undefined) console.log(asset);
// TODO 先不考虑一层一层往上的情况，项目级别的node_modules
const isNPM = libPath.includes('node_modules');
let libOutputPath;
if (isNPM) {
// npmPlugin.call(this, libFile, config, enc);
libOutputPath = path.join(
mpb.dest,
path
.relative(mpb.cwd, libPath)
.replace('node_modules', mpb.config.output.npm)
);
libOutputPath = this.mainPkgPathMap[libPath];
if(!libOutputPath) {
libOutputPath = path.join(
mpb.dest,
`./${root}`,
path
.relative(mpb.cwd, libPath)
.replace('node_modules', mpb.config.output.npm)
);
if(!root) {
this.mainPkgPathMap[libPath] = libOutputPath;
}
}
} else {
libOutputPath = path.join(
mpb.dest,
Expand Down Expand Up @@ -106,7 +120,11 @@ module.exports = class HandleJSDep {
await Promise.all(
deps.map((dep) => {
const { libPath, libOutputPath } = dep;
return mpb.assetManager.addAsset(libPath, libOutputPath);
const root = asset.getMeta('root');
return mpb.assetManager.addAsset(libPath, libOutputPath, {
root,
source: asset.filePath
});
})
);
} catch (e) {
Expand All @@ -116,4 +134,4 @@ module.exports = class HandleJSDep {
return asset;
});
}
};
};
52 changes: 46 additions & 6 deletions src/plugin/handleJSONComponentDep.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,15 @@
*/
const path = require('path');
const { assetType } = require('../consts');
const resolve = require('resolve');
const COMPS_DIR = './npm_components';
const NPM_PATH_NAME = 'node_modules';

module.exports = class HandleJSONComponentDep {
constructor() {
this.mainPkgPathMap = {};
}

apply(mpb) {
mpb.hooks.beforeEmitFile.tapPromise('HandleJSONComponentDep', async (asset) => {
// const key = asset.getMeta('mbp-scan-json-dep');
Expand All @@ -23,14 +30,47 @@ module.exports = class HandleJSONComponentDep {
filePath = path.resolve(mpb.src, `.${src}`);
} else if (src[0] === '.') {
filePath = path.resolve(asset.dir, src);
} else if (src[0] === '@'){
filePath = resolve.sync(src);
filePath = filePath.replace(path.parse(filePath).ext, '');
} else {
filePath = path.resolve(asset.dir, `./${src}`);
}
mpb.scan.addAssetByEXT(
filePath.replace(mpb.src, ''),
path.resolve(mpb.dest, path.relative(mpb.src, filePath)),
assetType.component
);

const nmPathIndex = filePath.indexOf(NPM_PATH_NAME);
const root = asset.getMeta('root');
if(!!~nmPathIndex) {
let usePath = this.mainPkgPathMap[filePath];
if(usePath) {
componets[componentName] = usePath;
asset.contents = JSON.stringify(code);
return;
}
usePath = path.resolve('/' + root, COMPS_DIR, `${filePath.substr(nmPathIndex + NPM_PATH_NAME.length + 1)}`);
if(!root) {
this.mainPkgPathMap[filePath] = usePath;
}
componets[componentName] = usePath;
asset.contents = JSON.stringify(code);

mpb.scan.addAssetByEXT(
filePath,
path.resolve(mpb.dest, `.${usePath}`),
assetType.component,
undefined,
root,
asset.filePath
);
} else {
mpb.scan.addAssetByEXT(
filePath.replace(mpb.src, ''),
path.resolve(mpb.dest, path.relative(mpb.src, filePath)),
assetType.component,
undefined,
root,
asset.filePath
);
}
})
);
}
Expand All @@ -39,4 +79,4 @@ module.exports = class HandleJSONComponentDep {
return asset;
});
}
};
};
9 changes: 7 additions & 2 deletions src/plugin/handleWXMLDep.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,9 +44,14 @@ module.exports = class HandleWXMLDep {
} else {
filePath = path.resolve(asset.dir, `./${src}`);
}
const root = asset.getMeta('root');
return mpb.assetManager.addAsset(
filePath,
path.resolve(mpb.dest, path.relative(mpb.src, filePath))
path.resolve(mpb.dest, path.relative(mpb.src, filePath)),
{
root,
source: asset.filePath
}
);
})
);
Expand All @@ -57,4 +62,4 @@ module.exports = class HandleWXMLDep {
return asset;
});
}
};
};
9 changes: 7 additions & 2 deletions src/plugin/handleWXSSDep.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,14 @@ module.exports = class HandleWXSSDep {
} else {
filePath = path.resolve(asset.dir, `./${src}`);
}
const root = asset.getMeta('root');
return mpb.assetManager.addAsset(
filePath,
path.resolve(mpb.dest, path.relative(mpb.src, filePath))
path.resolve(mpb.dest, path.relative(mpb.src, filePath)),
{
root,
source: asset.filePath
}
);
})
);
Expand All @@ -42,4 +47,4 @@ module.exports = class HandleWXSSDep {
return asset;
});
}
};
};
11 changes: 7 additions & 4 deletions src/scan.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,10 @@ module.exports = class ScanDep {
this.modules = {};
}

addAssetByEXT(prefixPath, prefixOutputPath, type = assetType.page, base = this.mpb.config.src) {
addAssetByEXT(prefixPath, prefixOutputPath, type = assetType.page, base = this.mpb.config.src, root = '', source = '') {
return Promise.all(
this.exts.map((ext) => {
const meta = { type };
const meta = { type, root, source };
if (ext === '.json') {
meta['mbp-scan-json-dep'] = 'usingComponents';
}
Expand Down Expand Up @@ -88,7 +88,10 @@ module.exports = class ScanDep {
Object.keys(pages).map((pageRouter) =>
this.addAssetByEXT(
pages[pageRouter],
path.join(this.mpb.dest, root, pageRouter)
path.join(this.mpb.dest, root, pageRouter),
undefined,
undefined,
root
)
)
);
Expand All @@ -106,4 +109,4 @@ module.exports = class ScanDep {
await this.init();
await this.mpb.hooks.afterCompile.promise(this.mpb);
}
};
};
22 changes: 12 additions & 10 deletions src/watching.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -95,15 +95,17 @@ module.exports = class Watching {
console.log(chalk.cyan('[watching-asset]'), path, type);
const perfId = this.generatePerfId();
perf.start(perfId);
const asset = this.mpb.assetManager.getAsset(path);
if (asset) {
if (type === 'change') {
console.log('[watching-add-asset]', path);
await this.mpb.assetManager.addAsset(path, asset.outputFilePath, asset.meta);
} else if (type === 'unlink') {
await this.mpb.assetManager.delAsset(asset);
} else {
console.error('不支持的watch类型:', type);
const assets = this.mpb.assetManager.getAssets(path);
if (assets) {
for(let asset of assets) {
if (type === 'change') {
console.log('[watching-add-asset]', path);
await this.mpb.assetManager.addAsset(path, asset.outputFilePath, asset.getMeta());
} else if (type === 'unlink') {
await this.mpb.assetManager.delAsset(asset);
} else {
console.error('不支持的watch类型:', type);
}
}
} else {
console.warn('[watching] 这里不应该 在assetManager里面找不到对应的文件');
Expand Down Expand Up @@ -157,4 +159,4 @@ module.exports = class Watching {
close() {
this.watcher && this.watcher.close();
}
};
};

0 comments on commit 370360d

Please sign in to comment.