@mpxjs/webpack-plugin 2.8.13 → 2.8.16

package/lib/style-compiler/index.js

@@ -86,13 +86,42 @@ module.exports = function (css, map) {
         if (mode === 'ali' && isApp) {
           result.css += `\n.${MPX_ROOT_VIEW} { display: initial }\n.${MPX_APP_MODULE_ID} { line-height: normal }`
         }
-        if (result.messages) {
-          result.messages.forEach(({ type, file }) => {
-            if (type === 'dependency') {
-              this.addDependency(file)
-            }
-          })
+
+        for (const warning of result.warnings()) {
+          this.emitWarning(warning)
         }
+
+        // todo 后续考虑直接使用postcss-loader来处理postcss
+        for (const message of result.messages) {
+          // eslint-disable-next-line default-case
+          switch (message.type) {
+            case 'dependency':
+              this.addDependency(message.file)
+              break
+
+            case 'build-dependency':
+              this.addBuildDependency(message.file)
+              break
+
+            case 'missing-dependency':
+              this.addMissingDependency(message.file)
+              break
+
+            case 'context-dependency':
+              this.addContextDependency(message.file)
+              break
+
+            case 'dir-dependency':
+              this.addContextDependency(message.dir)
+              break
+
+            case 'asset':
+              if (message.content && message.file) {
+                this.emitFile(message.file, message.content, message.sourceMap, message.info)
+              }
+          }
+        }
+
         const map = result.map && result.map.toJSON()
         cb(null, result.css, map)
         return null // silence bluebird warning

package/lib/wxss/loader.js

@@ -45,8 +45,7 @@ module.exports = async function loader (content, map, meta) {
   let options
 
   try {
-    options = normalizeOptions(rawOptions, this)
-    options = Object.assign({}, options, { sourceMap, root, externals })
+    options = normalizeOptions(Object.assign({}, rawOptions, { sourceMap }), this)
   } catch (error) {
     callback(error)
 
@@ -60,7 +59,7 @@ module.exports = async function loader (content, map, meta) {
     plugins.push(...getModulesPlugins(options, this))
   }
 
-  let importPluginImports = []
+  const importPluginImports = []
   const importPluginApi = []
 
   let isSupportAbsoluteURL = false
@@ -78,22 +77,26 @@ module.exports = async function loader (content, map, meta) {
     options.esModule && Boolean('fsStartTime' in this._compiler)
 
   if (shouldUseImportPlugin(options)) {
+    const { getRequestString } = createHelpers(this)
     plugins.push(
       importParser({
         isSupportAbsoluteURL: false,
         isSupportDataURL: false,
+        externals,
+        root,
         isCSSStyleSheet: options.exportType === 'css-style-sheet',
         loaderContext: this,
         imports: importPluginImports,
         api: importPluginApi,
         filter: options.import.filter,
-        urlHandler: (url) =>
-          stringifyRequest(
-            this,
-            combineRequests(getPreRequester(this)(options.importLoaders), url)
-          ),
-        externals: options.externals,
-        root: options.root
+        urlHandler: (url) => {
+          url = combineRequests(getPreRequester(this)(options.importLoaders), url)
+          return getRequestString('styles', { src: url }, {
+            isStatic: true,
+            issuerResource: this.resource,
+            fromImport: true
+          })
+        }
       })
     )
   }
@@ -107,6 +110,8 @@ module.exports = async function loader (content, map, meta) {
       urlParser({
         isSupportAbsoluteURL,
         isSupportDataURL,
+        externals,
+        root,
         imports: urlPluginImports,
         replacements,
         context: this.context,
@@ -205,22 +210,6 @@ module.exports = async function loader (content, map, meta) {
     this.emitWarning(new Warning(warning))
   }
 
-  const { getRequestString } = createHelpers(this)
-
-  // 符合css后缀名的文件经过mpx处理后会带上相应的后缀防止 WebPack 的默认解析规则，后续 require/import 相应路径时，导出的不是一段 css 代码了，事实上是一个文件路径。
-  importPluginImports = importPluginImports.map((importItem, index) => {
-    const splittedUrl = importItem.url.slice(1, -1)
-    const requestString = getRequestString('styles', { src: splittedUrl }, {
-      isStatic: true,
-      issuerResource: this.resource,
-      fromImport: true
-    }, index)
-    return {
-      ...importItem,
-      url: requestString
-    }
-  })
-
   const imports = []
     .concat(icssPluginImports.sort(sort))
     .concat(importPluginImports.sort())

package/lib/wxss/plugins/postcss-import-parser.js

@@ -46,7 +46,7 @@ function parseNode (atRule, key, options) {
   // Nodes do not exists - `@import url('http://') :root {}`
   if (atRule.nodes) {
     const error = new Error(
-      "It looks like you didn't end your @import statement correctly. Child nodes are attached to it."
+      'It looks like you didn\'t end your @import statement correctly. Child nodes are attached to it.'
     )
 
     error.node = atRule
@@ -215,7 +215,7 @@ const plugin = (options = {}) => {
               options.loaderContext.emitError(
                 new Error(
                   atRule.error(
-                    "'@import' rules are not allowed here and will not be processed"
+                    '\'@import\' rules are not allowed here and will not be processed'
                   ).message
                 )
               )
@@ -223,7 +223,7 @@ const plugin = (options = {}) => {
               return
             }
 
-            const { isSupportDataURL, isSupportAbsoluteURL } = options
+            const { isSupportDataURL, isSupportAbsoluteURL, externals, root } = options
 
             let parsedAtRule
 
@@ -231,7 +231,8 @@ const plugin = (options = {}) => {
               parsedAtRule = parseNode(atRule, 'params', {
                 isSupportAbsoluteURL,
                 isSupportDataURL,
-                externals: options.externals
+                externals,
+                root
               })
             } catch (error) {
               result.warn(error.message, { node: error.node })

package/lib/wxss/plugins/postcss-url-parser.js

@@ -296,10 +296,12 @@ const plugin = (options = {}) => {
 
       return {
         Declaration (declaration) {
-          const { isSupportDataURL, isSupportAbsoluteURL } = options
+          const { isSupportDataURL, isSupportAbsoluteURL, externals, root } = options
           const parsedURL = parseDeclaration(declaration, 'value', result, {
             isSupportDataURL,
-            isSupportAbsoluteURL
+            isSupportAbsoluteURL,
+            externals,
+            root
           })
 
           if (!parsedURL) {

package/lib/wxss/utils.js

@@ -317,7 +317,7 @@ function escapeLocalIdent (localident) {
   // TODO simplify in the next major release
   return escape(
     localident
-      // For `[hash]` placeholder
+    // For `[hash]` placeholder
       .replace(/^((-?[0-9])|--)/, '_$1')
       .replace(filenameReservedRegex, '-')
       .replace(reControlChars, '-')
@@ -389,7 +389,7 @@ function defaultGetLocalIdent (
     hash.update(Buffer.from(options.content, 'utf8'))
 
     localIdentHash = (localIdentHash + hash.digest(hashDigest))
-      // Remove all leading digits
+    // Remove all leading digits
       .replace(/^\d+/, '')
       // Replace all slashes with underscores (same as in base64url)
       .replace(/\//g, '_')
@@ -652,13 +652,13 @@ function getModulesOptions (rawOptions, exportType, loaderContext) {
   if (needNamedExport) {
     if (rawOptions.esModule === false) {
       throw new Error(
-        "The 'exportType' option with the 'css-style-sheet' or 'string' value requires the 'esModules' option to be enabled"
+        'The \'exportType\' option with the \'css-style-sheet\' or \'string\' value requires the \'esModules\' option to be enabled'
       )
     }
 
     if (modulesOptions.namedExport === false) {
       throw new Error(
-        "The 'exportType' option with the 'css-style-sheet' or 'string' value requires the 'modules.namedExport' option to be enabled"
+        'The \'exportType\' option with the \'css-style-sheet\' or \'string\' value requires the \'modules.namedExport\' option to be enabled'
       )
     }
   }
@@ -666,7 +666,7 @@ function getModulesOptions (rawOptions, exportType, loaderContext) {
   if (modulesOptions.namedExport === true) {
     if (rawOptions.esModule === false) {
       throw new Error(
-        "The 'modules.namedExport' option requires the 'esModules' option to be enabled"
+        'The \'modules.namedExport\' option requires the \'esModules\' option to be enabled'
       )
     }
 
@@ -896,18 +896,18 @@ function getPreRequester ({ loaders, loaderIndex }) {
       return cache[number]
     }
 
-    if (number === false) {
-      cache[number] = ''
-    } else {
+    if (typeof number === 'number') {
       const loadersRequest = loaders
         .slice(
           loaderIndex,
-          loaderIndex + 1 + (typeof number !== 'number' ? 0 : number + 1) // 与css-loader 不同，需要增加 1，因为 css 文件会经过 style-compiler loader 进行处理。
+          loaderIndex + 1 + number
         )
         .map((x) => x.request)
         .join('!')
 
       cache[number] = `-!${loadersRequest}!`
+    } else {
+      cache[number] = ''
     }
 
     return cache[number]
@@ -924,7 +924,7 @@ function getImportCode (imports, options) {
       if (icss && options.modules.namedExport) {
         code += `import ${
           options.modules.exportOnlyLocals ? '' : `${importName}, `
-        }* as ${importName}_NAMED___ from ${url};\n`
+          }* as ${importName}_NAMED___ from ${url};\n`
       } else {
         code +=
           type === 'url'
@@ -1039,7 +1039,7 @@ function getModuleCode (
     options.sourceMap
       ? '___CSS_LOADER_API_SOURCEMAP_IMPORT___'
       : '___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___'
-  });\n`
+    });\n`
 
   for (const item of api) {
     const { url, layer, supports, media, dedupe } = item
@@ -1066,10 +1066,10 @@ function getModuleCode (
       code = code.replace(new RegExp(replacementName, 'g'), () =>
         options.modules.namedExport
           ? `" + ${importName}_NAMED___[${JSON.stringify(
-            getValidLocalName(
-              localName,
-              options.modules.exportLocalsConvention
-            )
+          getValidLocalName(
+            localName,
+            options.modules.exportLocalsConvention
+          )
           )}] + "`
           : `" + ${importName}.locals[${JSON.stringify(localName)}] + "`
       )
@@ -1172,7 +1172,7 @@ function getExportCode (exports, replacements, icssPluginUsed, options) {
         ? localsCode
         : `${
           options.esModule ? 'export default' : 'module.exports ='
-        } {\n${localsCode}\n};\n`
+          } {\n${localsCode}\n};\n`
 
       return code
     }
@@ -1181,7 +1181,7 @@ function getExportCode (exports, replacements, icssPluginUsed, options) {
       ? localsCode
       : `___CSS_LOADER_EXPORT___.locals = {${
         localsCode ? `\n${localsCode}\n` : ''
-      }};\n`
+        }};\n`
   }
 
   const isCSSStyleSheetExport = options.exportType === 'css-style-sheet'
@@ -1210,7 +1210,7 @@ function getExportCode (exports, replacements, icssPluginUsed, options) {
 
   code += `${
     options.esModule ? 'export default ' : 'module.exports ='
-  } ${finalExport};\n`
+    } ${finalExport};\n`
 
   return code
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/webpack-plugin",
-  "version": "2.8.13",
+  "version": "2.8.16",
   "description": "mpx compile core",
   "keywords": [
     "mpx"
@@ -82,5 +82,5 @@
   "engines": {
     "node": ">=14.14.0"
   },
-  "gitHead": "257b5bd882d6344be8ce36a99715c87f9d8adb51"
+  "gitHead": "79e2edd884ef6b27593952950f72343b98849bd7"
 }