kn-cli 1.0.21 → 1.0.23

package/build/build.sh

@@ -3,6 +3,7 @@ then
   echo "没有发现build_env，默认设置为prod"
   build_env="prod"
 fi
+echo "cli build模式强制设定 noSkipNpmInstall=1"
 export noSkipNpmInstall=1
 export mock=0
 export build_type=build

package/build/cli.config.js

@@ -1,9 +1,11 @@
 
 module.exports = {
+  name:'projectName',
   registryType:'npm',//npm镜像源,taobao|npm
   less:{
     javascriptEnabled:false,//是否开启less js
   },
+  // pxtorem:false,//默认:true,开启px转rem模式
   // site_root_path:'/dist/',// 默认:'',站点根目录
   // 自定义多入口
   // entry:{
@@ -24,5 +26,9 @@ module.exports = {
   // cssSplitMode:false,//false=关闭css文件分隔，将css内置到js内
   // sass:true,//true=开启sass支持,默认仅支持less
   // indexHtml:false,//false=关闭index.html的注入
+  // indexHtml:{
+  //   template:'index_template.html',
+  //   output:'../index.html',//将index.html输出到 dist目录外的index.html
+  // },
   // projectSourceFolder:'./',//项目源代码文件夹所在位置，默认是'src'
 };

package/build/postcss.config.js

@@ -1,6 +1,24 @@
+const fs = require('fs');
+const writeLog = require('./writeLog.js')()
+writeLog('读取 postcss.config.js');
+
+
+let CLI_CONFIG = {};
+let existsCli= fs.existsSync('./cli.config.js');
+if(existsCli){
+  CLI_CONFIG = require('./cli.config.js');
+}
+const pxtorem = CLI_CONFIG?.pxtorem??true;
+const plugins = [
+  require('postcss-preset-env'),
+];
+if(pxtorem){
+  writeLog('启用pxtorem');
+  plugins.push( require("postcss-pxtorem")({rootValue:100,propList:['*']}) )
+}else{
+  writeLog('关闭pxtorem');
+  console.log('关闭pxtorem')
+}
 module.exports = {
-    plugins:[
-      require('postcss-preset-env'),
-      require("postcss-pxtorem")({rootValue:100,propList:['*']})
-    ]
+  plugins
 }

package/build/webpack.config.js

@@ -1,5 +1,7 @@
 const path = require('path');
 const fs = require('fs');
+const log = require('./writeLog.js')()
+log('==========读取webpack.config.js===========');
 const webpack = require('webpack');
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
@@ -204,11 +206,19 @@ const rules= [
           }
         },
       },
-      'postcss-loader',
+      {
+        loader:'postcss-loader',
+        options:{
+          postcssOptions: {
+            config: path.resolve(webpackPath, "postcss.config.js"),
+          },
+        }
+      },
       {
         loader: 'less-loader',
         options:{
-          javascriptEnabled: CLI_CONFIG?.less?.javascriptEnabled??false
+          javascriptEnabled: CLI_CONFIG?.less?.javascriptEnabled??false,
+          modifyVars:CLI_CONFIG?.less?.modifyVars??false,
         }
       }
     ],
@@ -220,7 +230,14 @@ const rules= [
         loader: cssSplitMode?MiniCssExtractPlugin.loader:'style-loader',
       },
       'css-loader',
-      'postcss-loader'
+      {
+        loader:'postcss-loader',
+        options:{
+          postcssOptions: {
+            config: path.resolve(webpackPath, "postcss.config.js"),
+          },
+        }
+      },
     ],
   },
 ];
@@ -242,7 +259,14 @@ if(support_sass){
           }
         },
       },
-      'postcss-loader',
+      {
+        loader:'postcss-loader',
+        options:{
+          postcssOptions: {
+            config: path.resolve(webpackPath, "postcss.config.js"),
+          },
+        }
+      },
       {
         loader: 'sass-loader',
       }
@@ -341,11 +365,21 @@ if(indexHtml){
   if(jsSplitMode===true || jsSplitMode?.runtime !== false){
     shareJs.splice(0,0,'runtime');
   }
+  let index_template = path.join(dirname, 'index.html');
+  let index_template_output= 'index.html';
+  if(typeof indexHtml ==='object'){
+    if(indexHtml.template){
+      index_template = path.join(dirname, indexHtml.template);
+    }
+    if(indexHtml.output){
+      index_template_output = indexHtml.output;
+    }
+  }
   plugins.push(
     new HtmlWebpackPlugin({
       chunks: ['index',...shareJs],
-      template: path.join(dirname, 'index.html'),
-      filename: 'index.html',
+      template: index_template,
+      filename: index_template_output,
       inject: true,
       isProd: process.env.build_env == 'prod',
     }),

package/build/writeLog.js

@@ -0,0 +1,10 @@
+const fs = require('fs');
+const path = require('path');
+
+
+module.exports = function(dir='./'){
+  const logFile = path.resolve(dir,'cli.log');
+  return function(text){
+    fs.appendFileSync(logFile,`${text}\n`);
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kn-cli",
-  "version": "1.0.21",
+  "version": "1.0.23",
   "description": "",
   "main": "index.js",
   "scripts": {

package/readme.md

@@ -20,6 +20,7 @@
 # cli.config.js - 构建配置文件
 ```js
 module.exports = {
+  projectName:'项目名称',
   registryType:'npm',//默认:npm npm镜像源,taobao|npm
   less:{
     javascriptEnabled:false,//默认:false, 是否开启less中对js支持
@@ -46,6 +47,10 @@ module.exports = {
   cssSplitMode:false,//默认:true,false=关闭css文件分隔，将css内置到js内
   sass:true,//默认:false,true=开启sass支持,默认仅支持less
   indexHtml:false,//默认:true,false=关闭index.html的注入
+  // indexHtml:{
+  //   template:'index_template.html',
+  //   output:'../index.html',//将index.html输出到 dist目录外的index.html
+  // },
   projectSourceFolder:'./',//默认:'./public',项目源代码文件夹所在位置，默认是'src'
   site_root_path:'',//默认:'',站点根目录，
   // dist:'dist',// 默认:'dist',编译后文件输出目录
@@ -53,10 +58,20 @@ module.exports = {
   //   base:'',
   //   js:'',//js输出的目录
   // }
+  // pxtorem:false,//默认:true,开启px转rem模式
 };
 ```
 
 # 更新日志
+* 1.0.23  
+  1. 修正postcss.config无法正确读取的bug     
+  2. 增加对pxtorem插件的开关配置   
+  3. 增加构建日志文件    
+  4. 增加 cli.config.js内增加name名称配置  
+
+* 1.0.22  
+  1. cli.config.js 扩展indexHtml的配置项，详细参考注释  
+
 * 1.0.21  
   1. cli.config.js内扩展了copyFolder配置项目的功能，现在支持更多配置，详细参考注释
 

package/src/build.js

@@ -26,7 +26,14 @@ const ROOT=path.resolve(__dirname,"../");
 module.exports= async (options={})=> {
   const {type='dev'} = options;
   const projectPath = process.cwd();
-  const projectName = path.parse(projectPath).base;
+
+  const cliConfigJs = path.resolve(projectPath,'cli.config.js');
+  let existsCli= fs.existsSync(cliConfigJs);
+  let cliConfig;
+  if(existsCli){
+    cliConfig= require(cliConfigJs);
+  }
+  const projectName = cliConfig?.name??path.parse(projectPath).base;
 
   // 用户项目文件夹下的public目录
   const sourceDir = path.resolve(projectPath,'public');
@@ -39,12 +46,7 @@ module.exports= async (options={})=> {
   const tempWebpackPackagePath = path.resolve(tempWebpackDir,'package.json');
   const tempWebpackConfigPath = path.resolve(tempWebpackDir,'webpack.config.js');
   const tempStartShell = path.resolve(tempWebpackDir,'start.sh');
-  const cliConfigJs = path.resolve(projectPath,'cli.config.js');
-  let existsCli= fs.existsSync(cliConfigJs);
-  let cliConfig;
-  if(existsCli){
-    cliConfig= require(cliConfigJs);
-  }
+
 
   let projectPackage,webpackPackage;