houhaoyu

resolve standard mistake

Signed-off-by: houhaoyu <houhaoyu@huawei.com>
Change-Id: Ibf7f4e9346bfe817a3e847e4340d56722aa3ae0a

ace-loader/.eslintrc.js

@@ -19,7 +19,6 @@ module.exports = {
     es6: true,
     node: true,
   },
-  extends: ['google'],
   globals: {
     profiler: 'readonly',
     initStyleSheet: 'readonly',

ace-loader/plugin/templater/component_validator.js

@@ -760,50 +760,7 @@ function validateStyle(css, out, nodeLoc, relativePath) {
   if (css) {
     const cssStyle = {}
     const cssArray = css.split(';')
-    for (let i = 0; i < cssArray.length; i++) {
-      let styleContent = cssArray[i].trim().split(':')
-      if (preprocessSystemResourceReference(styleContent, cssStyle)) {
-        continue;
-      }
-      if (styleContent.length === 2) {
-        const key = styleContent[0].trim().replace(/-([a-z])/g, function(s, m) { return m.toUpperCase() })
-        let value = bind(styleContent[1].trim(), undefined, true, out, nodeLoc)
-        const contentValue = styleContent[1].trim().toString();
-        if (contentValue.match(/^linear-gradient/) && contentValue.match(/\(.*\{\{.*\}\}.*\)/)) {
-          log.push({
-            line: nodeLoc.line || 1,
-            column: nodeLoc.col || 1,
-            reason: `ERROR: can not bind data for linear-gradient in inline style at ${css}`
-          })
-        }
-        if (key === 'flex' && typeof value === 'string') {
-          expandFlex(key, value, cssStyle, nodeLoc, log)
-        } else {
-          const valuejsonTemplate = validateItem(key, value, nodeLoc, log)
-          value = valuejsonTemplate.value
-          if (['[object Number]', '[object String]', '[object Function]', '[object Object]', '[object Array]'].includes(
-              Object.prototype.toString.call(value))) {
-            expandStyle(key, value, valuejsonTemplate, cssStyle, out, nodeLoc, log)
-          }
-        }
-      }
-      if (styleContent.length > 2) {
-        styleContent[1] = styleContent.slice(1).join(':')
-        styleContent = styleContent.slice(0, 2)
-        if (REG_DATA_BINDING.test(styleContent[1])) {
-          styleContent[0] = styleContent[0].trim().replace(/-([a-z])/g, function(s, m) { return m.toUpperCase() })
-          cssStyle[styleContent[0]] = bind(styleContent[1], undefined, true, out, nodeLoc)
-        } else {
-          // handle special cases like "background-image: url('https://xxx.jpg')"
-          const key = styleContent[0].trim().replace(/-([a-z])/g, function(s, m) { return m.toUpperCase() })
-          if (key === 'backgroundImage') {
-            let value = styleContent[1].trim()
-            const valuejsonTemplate = validateItem(key, value, nodeLoc, log)
-            cssStyle[key] = valuejsonTemplate.value
-          }
-        }
-      }
-    }
+    processCssArray(css, out, nodeLoc, cssStyle, cssArray)
     out.jsonTemplate.style = cssStyle
     setDebugLine(out.jsonTemplate, relativePath, nodeLoc.line)
   } else {
@@ -815,6 +772,53 @@ function validateStyle(css, out, nodeLoc, relativePath) {
   }
 }
 
+function processCssArray(css, out, nodeLoc, cssStyle, cssArray) {
+  for (let i = 0; i < cssArray.length; i++) {
+    let styleContent = cssArray[i].trim().split(':')
+    if (preprocessSystemResourceReference(styleContent, cssStyle)) {
+      continue;
+    }
+    if (styleContent.length === 2) {
+      const key = styleContent[0].trim().replace(/-([a-z])/g, function(s, m) { return m.toUpperCase() })
+      let value = bind(styleContent[1].trim(), undefined, true, out, nodeLoc)
+      const contentValue = styleContent[1].trim().toString();
+      if (contentValue.match(/^linear-gradient/) && contentValue.match(/\(.*\{\{.*\}\}.*\)/)) {
+        log.push({
+          line: nodeLoc.line || 1,
+          column: nodeLoc.col || 1,
+          reason: `ERROR: can not bind data for linear-gradient in inline style at ${css}`
+        })
+      }
+      if (key === 'flex' && typeof value === 'string') {
+        expandFlex(key, value, cssStyle, nodeLoc, log)
+      } else {
+        const valuejsonTemplate = validateItem(key, value, nodeLoc, log)
+        value = valuejsonTemplate.value
+        if (['[object Number]', '[object String]', '[object Function]', '[object Object]', '[object Array]'].includes(
+          Object.prototype.toString.call(value))) {
+          expandStyle(key, value, valuejsonTemplate, cssStyle, out, nodeLoc, log)
+        }
+      }
+    }
+    if (styleContent.length > 2) {
+      styleContent[1] = styleContent.slice(1).join(':')
+      styleContent = styleContent.slice(0, 2)
+      if (REG_DATA_BINDING.test(styleContent[1])) {
+        styleContent[0] = styleContent[0].trim().replace(/-([a-z])/g, function(s, m) { return m.toUpperCase() })
+        cssStyle[styleContent[0]] = bind(styleContent[1], undefined, true, out, nodeLoc)
+      } else {
+        // handle special cases like "background-image: url('https://xxx.jpg')"
+        const key = styleContent[0].trim().replace(/-([a-z])/g, function(s, m) { return m.toUpperCase() })
+        if (key === 'backgroundImage') {
+          let value = styleContent[1].trim()
+          const valuejsonTemplate = validateItem(key, value, nodeLoc, log)
+          cssStyle[key] = valuejsonTemplate.value
+        }
+      }
+    }
+  }
+}
+
 function expandFlex(key, value, cssStyle, nodeLoc, log) {
   const valueArray = value.split(/\s+/)
   if (valueArray.length === 1) {
@@ -870,7 +874,8 @@ function expandFlexTwo(key, value, valueArray, cssStyle, nodeLoc, log) {
     log.push({
       line: nodeLoc.line,
       column: nodeLoc.column,
-      reason: 'ERROR: Value `' + value + '` of the `' + key + '` attribute is incorrect. Value `' + valueArray[0] + '` must be a number.',
+      reason: 'ERROR: Value `' + value + '` of the `' + key + '` attribute is incorrect. Value `' +
+        valueArray[0] + '` must be a number.',
     })
   }
 }
@@ -885,7 +890,8 @@ function expandFlexThree(key, value, valueArray, cssStyle, nodeLoc, log) {
     log.push({
       line: nodeLoc.line,
       column: nodeLoc.column,
-      reason: 'ERROR: Value `' + value + '` of the `' + key + '` attribute is incorrect. It must be in the format of (1, 1, 1px).',
+      reason: 'ERROR: Value `' + value + '` of the `' + key +
+        '` attribute is incorrect. It must be in the format of (1, 1, 1px).',
     })
   }
 }
@@ -1159,21 +1165,11 @@ function validateAttr(resourcePath, attrName, attrValue, out, tagName, nodeLoc,
     // target format: {{$r('sys.media.sys_background_image')}}
     let SysResourceTypeRefReg = /{{\s*\$r\s*\(\s*(['"]sys\.media\.(?<resName>\w+)['"])\s*\)\s*}}/
     result = SysResourceTypeRefReg.exec(attrValue);
-    if (result) {
-      const resourceName = result.groups['resName']
-      if (resourceName && OHOS_THEME_PROP_GROUPS[resourceName]) {
-        attrValue = "@sys.media." + OHOS_THEME_PROP_GROUPS[resourceName]
-      }
-    }
+    getAttrValue(result, attrValue, true);
     // target format: {{$r('app.media.customized_background_image')}}
     let AppResourceTypeRefReg = /{{\s*\$r\s*\(\s*(['"]app\.media\.(?<resName>\w+)['"])\s*\)\s*}}/
     result = AppResourceTypeRefReg.exec(attrValue);
-    if (result) {
-      const resourceName = result.groups['resName']
-      if (resourceName) {
-        attrValue = "@app.media." + resourceName
-      }
-    }
+    getAttrValue(result, attrValue, false);
 
     if (tagWithPath.indexOf(attrName) >= 0 && attrValue.match(/^\.\.\/|^\.\//)) {
       if (!resourcePath) {
@@ -1192,6 +1188,20 @@ function validateAttr(resourcePath, attrName, attrValue, out, tagName, nodeLoc,
   }
 }
 
+function getAttrValue(result, attrValue, isSys) {
+  if (result && isSys) {
+    const resourceName = result.groups['resName']
+    if (resourceName && OHOS_THEME_PROP_GROUPS[resourceName]) {
+      attrValue = "@sys.media." + OHOS_THEME_PROP_GROUPS[resourceName]
+    }
+  } else if (result && !isSys) {
+    const resourceName = result.groups['resName']
+    if (resourceName) {
+      attrValue = "@app.media." + resourceName
+    }
+  }
+}
+
 /**
  * parse elif attr
  *

ace-loader/src/lite/lite-return-exports-plugin.js

@@ -19,6 +19,7 @@ const pluginName = 'LiteReturnExportsPlugin';
  * LiteReturnExportsPlugin
  */
 class LiteReturnExportsPlugin {
+
   /**
    * return exports from runtime
    * @param {Object} compiler API specification, all configuration information of Webpack environment.

ace-loader/src/lite/lite-transform-style.js

@@ -67,6 +67,7 @@ function transformStyle(value) {
   res = JSON.stringify(styleSheet);
   return res;
 }
+
 /**
  * keyFrame style special compilation.
  * @param {Obejct} obj Preliminary compilation results of keyFrame style.

ace-loader/src/loader-gen.js

@@ -16,6 +16,7 @@
 /**
  * Copyright (c) Huawei Technologies Co., Ltd. 2021-2021. All rights reserved.
  */
+import { generate } from 'escodegen'
 import loaderUtils from 'loader-utils'
 import path from 'path'
 
@@ -60,8 +61,6 @@ function getLoaderString (type, config) {
       return configLoaderString(loaders, config)
     case 'data':
       return dataLoaderString(loaders, config)
-    default:
-      return
   }
 }
 
@@ -200,29 +199,12 @@ function codegenHmlAndCss() {
       jsonLoaders('json', undefined, true, 'json'), this.resourcePath)
     output += '\n//card_end'
   } else {
-    output = 'var $app_script$ = ' + getRequireString(this, getLoaderString('script', {
-      customLang,
-      lang: undefined,
-      element: undefined,
-      elementName: undefined,
-      source: jsFileName
-    }), jsFileName)
+    const that = this
+    output = 'var $app_script$ = ' + generateOutput(that, 'script', jsFileName, isElement)
 
-    output += 'var $app_template$ = ' + getRequireString(this, getLoaderString('template', {
-      customLang,
-      lang: undefined,
-      element: isElement,
-      elementName: undefined,
-      source: this.resourcePath
-    }), this.resourcePath)
+    output += 'var $app_template$ = ' + generateOutput(that, 'template', jsFileName, isElement)
 
-    output += 'var $app_style$ = ' + getRequireString(this, getLoaderString('style', {
-      customLang,
-      lang: undefined,
-      element: isElement,
-      elementName: undefined,
-      source: this.resourcePath
-    }), this.resourcePath)
+    output += 'var $app_style$ = ' + generateOutput(that, 'style', jsFileName, isElement)
 
     output += `
     $app_define$('@app-component/${getNameByPath(this.resourcePath)}', [],
@@ -246,4 +228,38 @@ function codegenHmlAndCss() {
   }
   return output
 }
+
+function generateOutput(that, type, jsFileName, isElement) {
+  let result
+  switch (type) {
+    case 'script':
+      result = getRequireString(that, getLoaderString('script', {
+        customLang,
+        lang: undefined,
+        element: undefined,
+        elementName: undefined,
+        source: jsFileName
+      }), jsFileName)
+      break
+    case 'template':
+      result = getRequireString(that, getLoaderString('template', {
+        customLang,
+        lang: undefined,
+        element: isElement,
+        elementName: undefined,
+        source: that.resourcePath
+      }), that.resourcePath)
+      break
+    case 'style':
+      result = getRequireString(that, getLoaderString('style', {
+        customLang,
+        lang: undefined,
+        element: isElement,
+        elementName: undefined,
+        source: that.resourcePath
+      }), that.resourcePath)
+  }
+  return result
+}
+
 module.exports = codegenHmlAndCss

ace-loader/webpack.rich.config.js

@@ -201,8 +201,7 @@ function setConfigs(env) {
   }
 }
 
-
-module.exports = (env) => {
+function processConfig(env) {
   setConfigs(env)
   deleteFolderRecursive(process.env.buildPath);
   config.cache.cacheDirectory = path.resolve(process.env.cachePath, '.rich_cache');
@@ -223,6 +222,61 @@ module.exports = (env) => {
       './node_modules'
     ]
   }
+}
+
+function notPreview(env) {
+  config.plugins.push(new ModuleCollectionPlugin())
+  if (env.compilerType && env.compilerType === 'ark') {
+    let arkDir = path.join(__dirname, 'bin', 'ark');
+    if (env.arkFrontendDir) {
+      arkDir = env.arkFrontendDir;
+    }
+    let nodeJs = 'node';
+    if (env.nodeJs) {
+      nodeJs = env.nodeJs;
+    }
+    config.plugins.push(new GenAbcPlugin(process.env.buildPath, arkDir, nodeJs,
+      env.buildMode === 'debug'))
+  } else {
+    if (env.deviceType) {
+      let deviceArr = env.deviceType.split(/,/)
+      let isDefault = deviceArr.indexOf('tv') >= 0 || deviceArr.indexOf('wearable') >= 0 ? true : false
+      if (isDefault) {
+        config.plugins.push(new GenBinPlugin(process.env.buildPath, path.join(__dirname, 'bin')))
+      }
+    }
+  }
+}
+
+function isRelease(env) {
+  config.mode = 'production'
+  config.optimization = {
+    minimize: true,
+    minimizer: [
+      new TerserPlugin({
+        terserOptions: {
+          keep_fnames: true
+        },
+        minify: (file, sourceMap) => {
+          const uglifyEsOptions = {
+            compress: {
+              unused: true
+            },
+            sourceMap: true
+          };
+          if (process.env.DEVICE_LEVEL === 'rich' && /\/workers\//.test(Object.keys(file)[0])) {
+            uglifyEsOptions.compress.unused = false;
+          }
+          return require('uglify-es').minify(file, uglifyEsOptions);
+        },
+      })
+    ]
+  }
+  config.output.sourceMapFilename = '_releaseMap/[name].js.map'
+}
+
+module.exports = (env) => {
+  processConfig(env);
   if (fs.existsSync(path.resolve(process.env.projectPath, 'i18n'))) {
     config.plugins.push(new CopyPlugin({
       patterns: [
@@ -250,56 +304,13 @@ module.exports = (env) => {
     config.plugins.push(new AfterEmitPlugin())
   } else {
     if (env.isPreview !== "true") {
-      config.plugins.push(new ModuleCollectionPlugin())
-      if (env.compilerType && env.compilerType === 'ark') {
-        let arkDir = path.join(__dirname, 'bin', 'ark');
-        if (env.arkFrontendDir) {
-          arkDir = env.arkFrontendDir;
-        }
-        let nodeJs = 'node';
-        if (env.nodeJs) {
-          nodeJs = env.nodeJs;
-        }
-        config.plugins.push(new GenAbcPlugin(process.env.buildPath, arkDir, nodeJs,
-          env.buildMode === 'debug'))
-      } else {
-        if (env.deviceType) {
-          let deviceArr = env.deviceType.split(/,/)
-          let isDefault = deviceArr.indexOf('tv') >= 0 || deviceArr.indexOf('wearable') >= 0 ? true : false
-          if (isDefault) {
-            config.plugins.push(new GenBinPlugin(process.env.buildPath, path.join(__dirname, 'bin')))
-          }
-        }
-      }
+      notPreview(env)
     }
     if (env.sourceMap === 'none') {
       config.devtool = false
     }
     if (env.buildMode === 'release') {
-      config.mode = 'production'
-      config.optimization = {
-        minimize: true,
-        minimizer: [
-          new TerserPlugin({
-            terserOptions: {
-              keep_fnames: true
-            },
-            minify: (file, sourceMap) => {
-              const uglifyEsOptions = {
-                compress: {
-                  unused: true
-                },
-                sourceMap: true
-              };
-              if (process.env.DEVICE_LEVEL === 'rich' && /\/workers\//.test(Object.keys(file)[0])) {
-                uglifyEsOptions.compress.unused = false;
-              }
-              return require('uglify-es').minify(file, uglifyEsOptions);
-            },
-          })
-        ]
-      }
-      config.output.sourceMapFilename = '_releaseMap/[name].js.map'
+      isRelease(env)
     }
   }
   config.module.rules.push({