zmp-cli 3.15.6 → 3.15.8

package/create/init-zmp-ui.js

@@ -1,216 +0,0 @@
-#!/usr/bin/env node
-/* eslint no-console: off */
-const exec = require('exec-sh');
-const path = require('path');
-const chalk = require('chalk');
-const logSymbols = require('log-symbols');
-const fse = require('../utils/fs-extra');
-const generatePackageJson = require('./utils/generate-package-json');
-const generateNpmScripts = require('./utils/generate-npm-scripts');
-
-const generateAppConfig = require('./utils/generate-app-config');
-
-const createFolders = require('./templates/create-folders');
-const copyAssets = require('./templates/copy-assets');
-const generateReadme = require('./utils/generate-readme');
-const generateGitignore = require('./utils/generate-gitignore');
-const log = require('../utils/log');
-const config = require('../config');
-
-const waitText = chalk.gray('(Please wait, it can take a while)');
-
-module.exports = async (
-  options = {},
-  logger,
-  { exitOnError = true, iconFile = null } = {}
-) => {
-  const cwd = options.cwd || process.cwd();
-  const isRunningInCwd = cwd === process.cwd();
-  function errorExit(err) {
-    log.error(err.stderr || err);
-    if (exitOnError) process.exit(1);
-  }
-  if (!logger) {
-    // eslint-disable-next-line
-    logger = {
-      statusStart() {},
-      statusDone() {},
-      statusError() {},
-      text() {},
-      error() {},
-    };
-  }
-  // App config
-  logger.statusStart('Generating app-config.json');
-  const appConfig = generateAppConfig(options);
-
-  fse.writeFileSync(
-    path.join(cwd, config.filename.appConfig),
-    appConfig.content
-  );
-  logger.statusDone('Generating app-config.json');
-
-  if (!options.newProject) {
-    const deployScripts = generateNpmScripts(['r']).map((s) => {
-      return `${s.icon} Run "npm run ${s.name}" - ${s.description}`;
-    });
-    logger.text(deployScripts.join('\n'));
-    process.exit(0);
-  }
-
-  // Package
-  logger.statusStart('Generating package.json');
-  const packageJson = generatePackageJson(options);
-  fse.writeFileSync(path.join(cwd, 'package.json'), packageJson.content);
-  fse.writeFileSync(
-    path.join(cwd, config.filename.zmpConfig),
-    JSON.stringify(options, '', 2)
-  );
-
-  logger.statusDone('Generating package.json');
-
-  // Create Folders
-  logger.statusStart('Creating required folders structure');
-  try {
-    createFolders(options);
-  } catch (err) {
-    logger.statusError('Error creating required folders structure');
-    // if (err) logger.error(err.stderr);
-    errorExit(err);
-  }
-  logger.statusDone('Creating required folders structure');
-
-  // Install NPM depenencies
-  logger.statusStart(`${'Installing NPM Dependencies'} ${waitText}`);
-  try {
-    if (!isRunningInCwd) {
-      await exec.promise(
-        `cd ${cwd.replace(
-          / /g,
-          '\\ '
-        )} && npm install ${packageJson.dependencies.join(' ')} --save`,
-        true
-      );
-    } else {
-      await exec.promise(
-        `npm install ${packageJson.dependencies.join(' ')} --save`,
-        true
-      );
-    }
-  } catch (err) {
-    logger.statusError('Error installing NPM Dependencies');
-    // if (err) logger.error(err.stderr);
-    errorExit(err);
-    return;
-  }
-  logger.statusDone('Installing NPM Dependencies');
-  // Install NPM dev depenencies
-  logger.statusStart(`${'Installing NPM Dev Dependencies'} ${waitText}`);
-  try {
-    if (!isRunningInCwd) {
-      await exec.promise(
-        `cd ${cwd.replace(
-          / /g,
-          '\\ '
-        )} && npm install ${packageJson.devDependencies.join(' ')} --save-dev`,
-        true
-      );
-    } else {
-      await exec.promise(
-        `npm install ${packageJson.devDependencies.join(' ')} --save-dev`,
-        true
-      );
-    }
-  } catch (err) {
-    logger.statusError('Error installing NPM Dev Dependencies');
-    // if (err) logger.error(err.stderr);
-    errorExit(err);
-    return;
-  }
-  logger.statusDone('Installing NPM Dev Dependencies');
-
-  if (packageJson.postInstall && packageJson.postInstall.length) {
-    logger.statusStart('Executing NPM Scripts');
-    try {
-      if (!isRunningInCwd) {
-        await exec.promise(
-          `cd ${cwd.replace(/ /g, '\\ ')} && npm run postinstall`,
-          true
-        );
-      } else {
-        await exec.promise('npm run postinstall', true);
-      }
-    } catch (err) {
-      logger.statusError('Error executing NPM Scripts');
-      // if (err) logger.error(err.stderr);
-      errorExit(err);
-      return;
-    }
-    logger.statusDone('Executing NPM Scripts');
-  }
-
-  // Create Project Files
-  logger.statusStart('Creating project files');
-  const filesToCopy = copyAssets(options, iconFile);
-  try {
-    // eslint-disable-next-line
-    await Promise.all(
-      filesToCopy.map((f) => {
-        if (f.from) {
-          return fse.copyFileAsync(f.from, f.to);
-        }
-        if (f.content) {
-          return fse.writeFileAsync(f.to, f.content);
-        }
-        return Promise.resolve();
-      })
-    );
-  } catch (err) {
-    logger.statusError('Error creating project files');
-    // if (err) logger.error(err.stderr || err);
-    errorExit(err);
-    return;
-  }
-
-  // Generate Readme
-  const readMeContent = generateReadme(options);
-  try {
-    fse.writeFileSync(path.join(cwd, 'README.md'), readMeContent);
-  } catch (err) {
-    logger.statusError('Error creating project files');
-    // if (err) logger.error(err.stderr || err);
-    errorExit(err);
-    return;
-  }
-
-  // Generate .gitignore
-  const gitignoreContent = generateGitignore(options);
-  try {
-    fse.writeFileSync(path.join(cwd, '.gitignore'), gitignoreContent);
-  } catch (err) {
-    logger.statusError('Error creating project files');
-    // if (err) logger.error(err.stderr || err);
-    errorExit(err);
-    return;
-  }
-
-  logger.statusDone('Creating project files');
-
-  let npmScripts = generateNpmScripts(['s', 'r']).map((s) => {
-    return `- ${s.icon} Run "npm run ${s.name}" - ${s.description}`;
-  });
-
-  // Final Text
-  const finalText = `
-${chalk.bold(logSymbols.success)} ${chalk.bold('Done!')} 💪
-
-${chalk.bold(logSymbols.info)} ${chalk.bold('Next steps:')}
-  ${npmScripts.join('\n  ')}
-  - 📖 Visit documentation at ${chalk.bold('https://mini.zalo.me/')}
-  - 📖 Check ${chalk.bold(
-    'README.md'
-  )} in project root folder with further instructions
-    `;
-
-  logger.text(finalText);
-};

package/create/templates/app-parameters.js

@@ -1,33 +0,0 @@
-const indent = require('../utils/indent');
-const templateIf = require('../utils/template-if');
-
-module.exports = (options) => {
-  const { framework, pkg, name, bundler, stateManagement } = options;
-
-  return indent(
-    0,
-    `
-    name: '${name}', // App name
-    theme: 'auto', // Automatic theme detection
-    ${templateIf(stateManagement === 'store', () => `
-    // App store
-    store: store,
-    `)}
-    ${templateIf(framework === 'core', () => `el: '#app', // App root element`)}
-    ${templateIf(
-      framework === 'core' && bundler,
-      () => `component: App, // App main component`
-    )}
-    ${templateIf(pkg, () => `id: '${pkg}', // App bundle ID`)}
-    ${templateIf(
-      framework === 'core',
-      () => ` on: {
-      init: function () {
-        var zmp = this;
-      },
-    },
-    `
-    )}
-    `
-  ).trim();
-};

package/create/templates/common/css/icons.css

@@ -1,60 +0,0 @@
-/* Material Icons Font (for MD theme) */
-@font-face {
-  font-family: 'Material Icons';
-  font-style: normal;
-  font-weight: 400;
-  src: url(//h5.zdn.vn/static/fonts/MaterialIcons-Regular.eot);
-  src: local('Material Icons'),
-       local('MaterialIcons-Regular'),
-       url(//h5.zdn.vn/static/fonts/MaterialIcons-Regular.woff2) format('woff2'),
-       url(//h5.zdn.vn/static/fonts/MaterialIcons-Regular.woff) format('woff'),
-       url(//h5.zdn.vn/static/fonts/MaterialIcons-Regular.ttf) format('truetype');
-}
-.material-icons {
-  font-family: 'Material Icons';
-  font-weight: normal;
-  font-style: normal;
-  font-size: 24px;
-  display: inline-flex;
-  line-height: 1;
-  text-transform: none;
-  letter-spacing: normal;
-  word-wrap: normal;
-  white-space: nowrap;
-  direction: ltr;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-  -moz-osx-font-smoothing: grayscale;
-  font-feature-settings: 'liga';
-}
-
-/* ZMP Icons Font (for iOS theme) */
-@font-face {
-  font-family: 'ZMP Icons';
-  font-style: normal;
-  font-weight: 400;
-  src: url("//h5.zdn.vn/static/fonts/ZMPIcons-Regular-v2.woff2") format("woff2"),
-       url("//h5.zdn.vn/static/fonts/ZMPIcons-Regular-v2.woff") format("woff"),
-       url("//h5.zdn.vn/static/fonts/ZMPIcons-Regular-v2.ttf") format("truetype");
-}
-.zmp-icons {
-  font-family: 'ZMP Icons';
-  font-weight: normal;
-  font-style: normal;
-  font-size: 28px;
-  line-height: 1;
-  letter-spacing: normal;
-  text-transform: none;
-  display: inline-flex;
-  white-space: nowrap;
-  word-wrap: normal;
-  direction: ltr;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: optimizeLegibility;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-feature-settings: "liga";
-  -moz-font-feature-settings: "liga=1";
-  -moz-font-feature-settings: "liga";
-  font-feature-settings: "liga";
-  text-align: center;
-}

package/create/templates/common/postcss.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  plugins: {
-    'postcss-preset-env': {},
-  },
-};

package/create/templates/common/tailwind/postcss.config.js

@@ -1,5 +0,0 @@
-const tailwindcss = require('tailwindcss');
-
-module.exports = {
-  plugins: [tailwindcss('./tailwind.config.js'), require('autoprefixer')],
-};

package/create/templates/common/tailwind/tailwind.config.js

@@ -1,9 +0,0 @@
-module.exports = {
-  purge: {
-    enabled: true,
-    content: ['./src/**/*.{js,jsx,ts,tsx,vue}'],
-  },
-  theme: {
-    extend: {},
-  },
-};

package/create/templates/common/tailwind/tailwind.css

@@ -1,3 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;

package/create/templates/common/webpack/build.js

@@ -1,41 +0,0 @@
-const webpack = require('webpack');
-const ora = require('ora');
-const rm = require('rimraf');
-const chalk = require('chalk');
-const config = require('./webpack.config.js');
-
-const env = process.env.NODE_ENV || 'development';
-const target = process.env.TARGET || 'web';
-
-const spinner = ora(
-  env === 'production'
-    ? 'building for production...'
-    : 'building development version...'
-);
-spinner.start();
-
-rm('./www/', (removeErr) => {
-  if (removeErr) throw removeErr;
-
-  webpack(config, (err, stats) => {
-    if (err) throw err;
-    spinner.stop();
-
-    process.stdout.write(
-      `${stats.toString({
-        colors: true,
-        modules: false,
-        children: false, // If you are using ts-loader, setting this to true will make TypeScript errors show up during build.
-        chunks: false,
-        chunkModules: false,
-      })}\n\n`
-    );
-
-    if (stats.hasErrors()) {
-      console.log(chalk.red('Build failed with errors.\n'));
-      process.exit(1);
-    }
-
-    console.log(chalk.cyan('Build complete.\n'));
-  });
-});

package/create/templates/copy-assets.js

@@ -1,158 +0,0 @@
-const path = require('path');
-const fse = require('../../utils/fs-extra');
-const stylesExtension = require('../utils/styles-extension');
-const copyVueAssets = require('./vue/copy-assets');
-const copyReactAssets = require('./react/copy-assets');
-const copyReactTsAssets = require('./react-typescript/copy-assets');
-const generateIndex = require('./generate-index');
-const generateStyles = require('./generate-styles');
-const generateScripts = require('./generate-scripts');
-const generateZMPCustom = require('./generate-zmp-custom');
-const copyZauiAssets = require('./zaui/copy-assets');
-const { projectFramework } = require('../../utils/constants');
-
-module.exports = (options, iconFile) => {
-  const cwd = options.cwd || process.cwd();
-  const {
-    package,
-    framework,
-    theming,
-    cssPreProcessor,
-    customBuild,
-    includeTailwind,
-  } = options;
-
-  const srcFolder = 'src';
-
-  const toCopy = [];
-  if (package !== 'zmp-ui') {
-    if (framework === projectFramework.VUE)
-      toCopy.push(...copyVueAssets(options));
-    if (framework === projectFramework.REACT)
-      toCopy.push(...copyReactAssets(options));
-    if (framework === projectFramework.REACT_TYPESCRIPT) {
-      toCopy.push(...copyReactTsAssets(options));
-    }
-  } else {
-    toCopy.push(...copyZauiAssets(options));
-  }
-  if (theming.iconFonts) {
-    // Copy Icons CSS
-    toCopy.push({
-      from: path.resolve(__dirname, 'common', 'css', 'icons.css'),
-      to: path.resolve(cwd, srcFolder, 'css', 'icons.css'),
-    });
-  }
-
-  if (includeTailwind) {
-    toCopy.push(
-      {
-        from: path.resolve(__dirname, 'common', 'tailwind', 'tailwind.css'),
-        to: path.resolve(cwd, srcFolder, 'css', 'tailwind.css'),
-      },
-      {
-        from: path.resolve(
-          __dirname,
-          'common',
-          'tailwind',
-          'tailwind.config.js'
-        ),
-        to: path.resolve(cwd, 'tailwind.config.js'),
-      },
-      {
-        from: path.resolve(
-          __dirname,
-          'common',
-          'tailwind',
-          'postcss.config.js'
-        ),
-        to: path.resolve(cwd, 'postcss.config.js'),
-      }
-    );
-  }
-
-  let appScriptFileName = 'app.js';
-  if (framework === 'react-typescript') {
-    appScriptFileName = 'app.ts';
-  }
-
-  // Copy Main Assets
-  toCopy.push(
-    ...[
-      {
-        content: generateIndex(options),
-        to: path.resolve(cwd, 'index.html'),
-      },
-      {
-        content: generateStyles(options),
-        to: path.resolve(
-          cwd,
-          srcFolder,
-          'css',
-          `app.${stylesExtension(cssPreProcessor)}`
-        ),
-      },
-      {
-        content: generateScripts(options),
-        to: path.resolve(cwd, srcFolder, appScriptFileName),
-      },
-    ]
-  );
-
-  // Copy Custom Build
-  if (customBuild) {
-    const customBuildAssets = generateZMPCustom(options);
-    toCopy.push(
-      ...[
-        {
-          content: customBuildAssets.styles,
-          to: path.resolve(cwd, srcFolder, 'css', 'zmp-custom.less'),
-        },
-        {
-          content: customBuildAssets.scripts,
-          to: path.resolve(cwd, srcFolder, 'js', 'zmp-custom.js'),
-        },
-      ]
-    );
-  }
-
-  if (!includeTailwind) {
-    // Copy PostCSS config
-    toCopy.push({
-      from: path.resolve(__dirname, 'common', 'postcss.config.js'),
-      to: path.resolve(cwd, 'postcss.config.js'),
-    });
-  }
-
-  // Copy Web Images & Icons
-  const assetsFolder = 'static';
-  fse.readdirSync(path.resolve(__dirname, 'common', 'icons')).forEach((f) => {
-    if (f.indexOf('.') === 0) return;
-    toCopy.push({
-      from: path.resolve(__dirname, 'common', 'icons', f),
-      to: path.resolve(cwd, srcFolder, assetsFolder, 'icons', f),
-    });
-  });
-
-  if (iconFile) {
-    fse.writeFileSync(
-      path.resolve(cwd, 'assets-src', 'web-icon.png'),
-      iconFile
-    );
-    fse.writeFileSync(
-      path.resolve(cwd, 'assets-src', 'apple-touch-icon.png'),
-      iconFile
-    );
-  } else {
-    toCopy.push({
-      from: path.resolve(__dirname, 'common', 'icons', '512x512.png'),
-      to: path.resolve(cwd, 'assets-src', 'web-icon.png'),
-    });
-    toCopy.push({
-      from: path.resolve(__dirname, 'common', 'icons', 'apple-touch-icon.png'),
-      to: path.resolve(cwd, 'assets-src', 'apple-touch-icon.png'),
-    });
-  }
-
-  return toCopy;
-};

package/create/templates/core/babel.config.js

@@ -1,11 +0,0 @@
-module.exports = {
-  presets: [
-    '@babel/preset-react',
-    ['@babel/preset-env', {
-      modules: false,
-    }],
-  ],
-  plugins: [
-    '@babel/plugin-transform-runtime',
-  ],
-};

package/create/templates/core/copy-assets.js

@@ -1,83 +0,0 @@
-const path = require('path');
-const fse = require('../../../utils/fs-extra');
-const generateHomePage = require('./generate-home-page');
-const generateRoot = require('./generate-root');
-const generateStore = require('../generate-store');
-const indent = require('../../utils/indent');
-
-module.exports = (options) => {
-  const cwd = options.cwd || process.cwd();
-  const { template, bundler } = options;
-  const toCopy = [];
-  const srcFolder = bundler ? 'src' : 'www';
-
-  // Copy Pages
-  const pages = [
-    ...(template !== 'blank' ? ['404', 'about', 'dynamic-route', 'form'] : []),
-    ...(template === 'tabs' ? ['catalog', 'product', 'settings'] : []),
-    ...(template === 'split-view' ? ['left-page-1', 'left-page-2'] : []),
-  ];
-
-  pages.forEach((p) => {
-    const src = path.resolve(__dirname, 'pages', `${p}.html`);
-    const dest = path.resolve(cwd, srcFolder, 'pages');
-    if (bundler !== 'webpack') {
-      toCopy.push({
-        from: src,
-        to: path.resolve(dest, `${p}.html`),
-      });
-    } else {
-      let content = fse.readFileSync(src);
-      if (content.trim().indexOf('<template') !== 0) {
-        content = `<template>\n${content.trim()}\n</template>\n<script>\nexport default () => {\n  return $render;\n};\n</script>`;
-      }
-      toCopy.push({
-        content,
-        to: path.resolve(dest, `${p}.zmp.html`),
-      });
-    }
-  });
-  toCopy.push({
-    content: generateStore(options),
-    to: path.resolve(cwd, srcFolder, 'store.js'),
-  });
-
-  if (bundler) {
-    toCopy.push({
-      content: `<template>\n${indent(
-        2,
-        generateHomePage(options).trim()
-      )}\n</template>\n<script>\nexport default () => {\n  return $render;\n}\n</script>`,
-      to: path.resolve(cwd, srcFolder, 'pages', 'home.zmp.html'),
-    });
-    toCopy.push({
-      content: generateRoot(options),
-      to: path.resolve(cwd, srcFolder, 'app.zmp.html'),
-    });
-
-    toCopy.push({
-      from: path.resolve(__dirname, 'babel.config.js'),
-      to: path.resolve(cwd, 'babel.config.js'),
-    });
-  } else {
-    // Copy ZMP
-    toCopy.push(...[]);
-    fse
-      .readdirSync(path.resolve(cwd, 'node_modules', 'zmp-framework/core'))
-      .filter((f) => {
-        return (
-          f.indexOf('.js') >= 0 ||
-          f.indexOf('.css') >= 0 ||
-          f.indexOf('.map') >= 0
-        );
-      })
-      .forEach((f) => {
-        toCopy.push({
-          from: path.resolve(cwd, 'node_modules', 'zmp-framework/core', f),
-          to: path.resolve(cwd, srcFolder, 'zmp-framework/core', f),
-        });
-      });
-  }
-
-  return toCopy;
-};