feat(cli): cli support webpack

.eslintrc.js

@@ -3,9 +3,7 @@ module.exports = {
     es2021: true,
     node: true
   },
-  extends: [
-    'standard'
-  ],
+  extends: 'standard',
   parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaVersion: 12,

src/cli/cli.ts

@@ -11,30 +11,31 @@ export function run (): void {
   const version = require('../../package.json').version
   program
     .version(version, '-v, --version', 'output the version number')
-    .option('--rootDir <path>', 'the directory of project to be transfered')
+    .option('-d --rootDir <path>', 'the directory of project to be transfered')
+    .option('-t --type <type>', 'the type of the project, use vue-cli or webpack')
     .parse(process.argv)
 
-  const keys = ['rootDir']
+  const keys = ['rootDir', 'type']
   const config: Config = {}
   keys.forEach(function (k) {
     if (Object.prototype.hasOwnProperty.call(program.opts(), k)) {
       config[k] = program.opts()[k]
     }
   })
-  start(config.rootDir)
+  start(config)
 }
 
-export function start (rootDir: string): void {
+export function start (config : Config): void {
   console.log('******************* Webpack to Vite *******************')
-  console.log(`Project path: ${rootDir}`)
+  console.log(`Project path: ${config.rootDir}`)
 
-  if (!fs.existsSync(rootDir)) {
-    console.error(`Project path is not correct : ${rootDir}`)
+  if (!fs.existsSync(config.rootDir)) {
+    console.error(`Project path is not correct : ${config.rootDir}`)
     return
   }
 
   const cwd = process.cwd()
-  rootDir = path.resolve(rootDir)
+  const rootDir = path.resolve(config.rootDir)
 
   // TODO:how to deal with the index.html in the project,
   // notice that this will not choose the root directory in non-vite projects

src/config/config.ts

@@ -1,5 +1,6 @@
 export interface Config {
     rootDir?: string;
+    type?: string;
 }
 
 export interface DevServer {

src/config/webpack.ts

@@ -25,7 +25,7 @@ export interface Resolve {
 
 export interface WebpackConfig extends Config {
     mode?: string;
-    entry?: string;
+    entry?: string | [] | {} ;
     output?: Output;
     module?: Module;
     resolve?: Resolve;

src/transform/transformWebpack.ts

@@ -1,45 +1,49 @@
-import { parseWebpackConfig } from '../config/parse';
-import { RawValue, ViteConfig } from '../config/vite';
-import { TransformContext } from './context';
-import { initViteConfig, Transformer } from './transformer';
-import path from 'path';
-import { DEFAULT_VUE_VERSION } from '../constants/constants';
+import { parseWebpackConfig } from '../config/parse'
+import { RawValue, ViteConfig } from '../config/vite'
+import { TransformContext } from './context'
+import { initViteConfig, Transformer } from './transformer'
+import path from 'path'
+import { DEFAULT_VUE_VERSION } from '../constants/constants'
 
 // convert webpack.config.js => vite.config.js
 export class WebpackTransformer implements Transformer {
-
     context : TransformContext = {
-        vueVersion: DEFAULT_VUE_VERSION,
-        config: initViteConfig(),
-        importList: [],
+      vueVersion: DEFAULT_VUE_VERSION,
+      config: initViteConfig(),
+      importList: []
     }
 
+    public async transform (rootDir: string): Promise<ViteConfig> {
+      const webpackConfig = await parseWebpackConfig(path.resolve(rootDir, 'webpack.config.js'))
+      const config = this.context.config
+
+      // convert base config
+      // TODO: convert entry
+      // webpack may have multiple entry files, e.g.
+      // 1. one entry, with one entry file : e.g. entry: './app/index.js'
+      // 2. one entry, with multiple entry files: e.g. entry: ['./pc/index.js','./wap/index.js']
+      // 3. multiple entries e.g. entry: {
+      //      wap: './pc/index.js',
+      //      pc: './wap/index.js'
+      // }
+      config.mode = webpackConfig.mode
+
+      const defaultAlias = []
 
-    public async transform(rootDir: string): Promise<ViteConfig> {
-        const webpackConfig = await parseWebpackConfig(path.resolve(rootDir, 'webpack.config.js'))
-        const config = this.context.config;
-
-        // convert base config
-        config.root = webpackConfig.entry
-        config.mode = webpackConfig.mode
+      const alias = {
+        '@': `${rootDir}/src`
+      }
+      Object.keys(alias).forEach((key) => {
+        const relativePath = path.relative(rootDir, alias[key]).replace(/\\/g, '/')
+        defaultAlias.push({
+          find: key,
+          replacement: new RawValue(`path.resolve(__dirname,'${relativePath}')`)
+        })
+      })
 
-        const defaultAlias = [];
-
-        const alias = {
-            '@':`${rootDir}/src`,
-        }
-        Object.keys(alias).forEach((key) => {
-            const relativePath = path.relative(rootDir,alias[key]).replace(/\\/g,'/');
-            defaultAlias.push({
-                find: key,
-                replacement: new RawValue(`path.resolve(__dirname,'${relativePath}')`),
-            });
-        });
+      config.resolve = {}
+      config.resolve.alias = defaultAlias
 
-        config.resolve = {};
-        config.resolve.alias = defaultAlias;
-
-        return null
+      return null
     }
-
 }