FOR MPX ONLY(WIP)

Author: light.liang

lib/loader.js

@@ -48,6 +48,7 @@ module.exports = function (content, map) {
     subPackagesMap,
     mainResourceMap,
     additionalAssets,
+    toBeRewriteSrcSet,
   } = compilationMpx;
 
   const appRequestpath = mainCompilation._preparedEntrypoints[0].request;
@@ -90,6 +91,30 @@ module.exports = function (content, map) {
     projectRoot,
   );
 
+  function retrieveSubPackRoot(originOutputPath, requestPath) {
+    let subPackageRoot = '';
+    // node_modules引用的是同一路径，只有子包引用时，这种在小程序引用不合法但对于npm引用合法，会根据源的打包输出路径来决定是否应该在子包打几份输出
+    if (processingSubPackages) {
+      for (let src in subPackagesMap) {
+        // 分包引用且主包未引用的资源，需打入分包目录中
+        if (originOutputPath.startsWith(src) && !mainResourceMap[requestPath]) {
+          subPackageRoot = subPackagesMap[src];
+          break;
+        }
+      }
+    } else {
+      mainResourceMap[requestPath] = true;
+    }
+    return subPackageRoot;
+  }
+
+  function genImportOutputFileName(subPackageRoot, requestPath) {
+    const selfResourceName = path.parse(requestPath).name;
+    const requestHash = hash(requestPath);
+    const outputFilename = toPosix(path.join(subPackageRoot, 'wxss', selfResourceName + requestHash + typeExtMap.styles));
+    return outputFilename;
+  }
+
   if (sourceMap) {
     if (map) {
       if (typeof map === 'string') {
@@ -154,35 +179,29 @@ module.exports = function (content, map) {
       if (loaderUtils.isUrlRequest(url, root)) {
         const originalPathWithoutExt = stripExtension(originFilePath);
         // Injected in child compilation to memorize origin component/page/app and parent css output location
-        let originOutputName =
+        let originOutputName;
+
+        // output name which was be rewritten from mpx file should be regenerated
+        if (toBeRewriteSrcSet.has(originFilePath)) {
+          const originSubPackageRoot = retrieveSubPackRoot(originFilePath, originFilePath);
+          originOutputName = genImportOutputFileName(originSubPackageRoot, originFilePath);
+        } else {
           // memorized origin
-          thisCompilation.$originalOutputName
-          // page
-          || pagesMap[originalPathWithoutExt]
-          // component
-          || componentsMap[originalPathWithoutExt]
-          // app
-          || path.relative(projectRoot, appRequestpath);
+          originOutputName = thisCompilation.$originalOutputName
+            // page
+            || pagesMap[originalPathWithoutExt]
+            // component
+            || componentsMap[originalPathWithoutExt]
+            // app
+            || path.relative(projectRoot, appRequestpath);
+        }
+
         const originOutputPath = path.resolve(projectRoot, originOutputName);
 
         // Part of these codes are copied from extract function
         const requestPath = path.resolve(path.dirname(originFilePath), url);
-        const selfResourceName = path.parse(requestPath).name;
-        let subPackageRoot = '';
-        // node_modules引用的是同一路径，只有子包引用时，这种在小程序引用不合法但对于npm引用合法，会根据源的打包输出路径来决定是否应该在子包打几份输出
-        if (compilationMpx.processingSubPackages) {
-          for (let src in subPackagesMap) {
-            // 分包引用且主包未引用的资源，需打入分包目录中
-            if (originOutputPath.startsWith(src) && !mainResourceMap[requestPath]) {
-              subPackageRoot = subPackagesMap[src];
-              break;
-            }
-          }
-        } else {
-          mainResourceMap[requestPath] = true;
-        }
-        const requestHash = hash(requestPath);
-        const outputFilename = toPosix(path.join(subPackageRoot, 'wxss', selfResourceName + requestHash + typeExtMap.styles));
+        const outputSubPackageRoot = retrieveSubPackRoot(originOutputPath, requestPath);
+        const outputFilename = genImportOutputFileName(outputSubPackageRoot, requestPath);
 
         const parentOutputName = thisCompilation.$parentOutputName || originOutputName;
 
@@ -207,7 +226,7 @@ module.exports = function (content, map) {
               new NodeTemplatePlugin(outputOptions),
               new LibraryTemplatePlugin(null, 'commonjs2'),
               new NodeTargetPlugin(),
-              new SingleEntryPlugin(this.context, childRequest, childFilename),
+              new SingleEntryPlugin(loaderContext.context, childRequest, childFilename),
               new LimitChunkCountPlugin({ maxChunks: 1 })
             ]);
 
@@ -247,7 +266,7 @@ module.exports = function (content, map) {
                 }
 
                 try {
-                  let text = this.exec(source, childRequest);
+                  let text = loaderContext.exec(source, childRequest);
                   if (Array.isArray(text)) {
                     text = text.map((item) => {
                       return item[1];