How to introduce mint-ui into fis3

my build tool uses fis3, using fis.hook ("node_modules"). Can be directly in the page import NPm package, but the CSS style has not been introduced, ask God to help analyze it.
I reported an error. When packing a VuE file,
Can"t resolve mint-ui/packages/cell/style.css in file [/ node_modules/mint-ui/lib/mint-ui.common.js]
cannot package the style part of js.

the environmental background of the problems and what methods you have tried

now my solution is to manually introduce mint-ui "s CSS in the required pages, which is just an impossible solution

related codes

/ / Please paste the code text below (do not replace the code with pictures)
/ / Server receive file configuration

var RECEIVER =" http://115.182.215.48/receive.";

/ / Test environment target address

var TARGET_PATH ="/ home/work/spw/app/cx-vrm-h5/fe-test-qa/webroot";

/ / two configuration modes
var deployConfig = {

// debug
"debug": {
    qa: ""
}

};

var namespace = "";

/ Project name
/ / fis.set ("namespace", "groupon");

/ / compilation of single-file components that support vue
fis.set ("project.fileType.text"," vue");

/ / ignore the compilation file
fis.set ("project.ignore", [

)
"/node_modules/**",
".DS_store",
"npm-debug.log",
"package.json",
"**.md",
"/test/**",
"karma.conf.js",
"/coverage/**",
"fis-conf.js"

]);

fis.match (":: package", {

)
postpackager: fis.plugin( "loader", {
    ignore: [ "common/static/js/mod/mod.js" ],
    allInOne: true, // jscss
    sourceMap: true, //map
    useInlineMap: true, //sourcemap
} )

});

/ language parsing and compiling

parser: fis.plugin( "less" ),
rExt: ".css"

});

/ / Vue compiles
fis.match ("* * .vue", {

)
rExt: ".js",
isMod: true,
useSameNameRequire: true,
parser: fis.plugin( "vue-component", {
    cssScopeFlag: "vuec"
} )

});

/ / vilify compression, babel compilation, backward compatibility, support vue compilation
fis.match ("{ .js, .vue: js}", {

isMod: true,
optimizer: fis.plugin( "uglify-js" ),
parser: [
    fis.plugin( "babel-5.x" ),
    fis.plugin( "translate-es3ify", null, "append" )
]

});

/ / less compiles
/ / .vue file, less parses
/ / automatically completes compatible prefixes
fis.match ("{ .less, .vue: less}", {

rExt: "css",
parser: [ fis.plugin( "less-2.x" ) ],
postprocessor: fis.plugin( "autoprefixer", {
    "browsers": [ "Firefox >= 20", "Safari >= 6", "IOS >= 6", "Chrome >= 12", "Android >= 2.2" ]
} )

});

/ / CSS compression
fis.match ("* *. {css,less}", {

optimizer: fis.plugin( "clean-css" )

});

/ / Image compression
fis.match ("*. {png,jpg}", {

optimizer: fis.plugin( "png-compressor" )

});

/ / csssprites
fis.match (":: package", {

)
spriter: fis.plugin( "csssprites" )

});

/ / homonym dependency
fis.match ("* *", {

)
useSameNameRequire: true

});

/ / fis3 does not come with modular development support by default, and the commonjs specification is used in conjunction with mod.js as a modular development.
/ / reference https://github.com/fex-team/f.
fis.hook( "commonjs", {

extList: [".js", ".jsx", ".es", ".ts", ".tsx",".vue"],
paths: {
    // vuenpm.main
    // Vue
    Vue: "./node_modules/vue/dist/vue.js",
    "mint-ui":"./node_modules/mint-ui",
    
    JsBarcode: "./node_modules/jsbarcode/dist/JsBarcode.all.js",
},

packages: [ {
        name: "lib",
        location: "./src/lib"
    },
    {
        name: "pages",
        location: "./client/pages"
    },
    {
        name: "common",
        location: "./common"
    },
    {
        name: "root",
        location: "./"
    },
    {
        name: "js",
        location: "./common/static/js"
    }, {
        name: "ui",
        location: "./common/widget/ui"
    }
]

});
fis.match ("/ {node_modules} / *. Js", {

)
isMod: true,
useSameNameRequire: true

});

/ / disable fis components
fis.unhook ("components")
fis.hook (" node_modules")

/ < strong Directory specification and publishing configuration < / strong

fis.media( i )
    .match( "**.html", {
        useHash: false,
        release: namespace + "$0",
        deploy: [ fis.plugin( "skip-packed" ),
            fis.plugin( "http-push", {
                receiver: RECEIVER,
                to: TARGET_PATH + deployConfig.debug[ i ]
            } )
        ]
    } )
    // js, css  hash
    .match( "**.{js,css,less,vue}", {
        isMod: true,
        useHash: true,
        optimizer: null,
        release: namespace + "/static/$0", //  /static 
        deploy: [ fis.plugin( "http-push", {
                receiver: RECEIVER,
                to: TARGET_PATH + deployConfig.debug[ i ]
            } ),
            // 
            // fis.plugin("skip-packed")
        ]
    } )
    .match( "common/static/js/mod/mod.js", {
        isMod: false,
        parser: null
    } )
    // 
    .match( "common/static/fonts/*", {
        useHash: true,
        release: namespace + "/static/$0", //  /static 
        deploy: [ fis.plugin( "skip-packed" ),
            fis.plugin( "http-push", {
                receiver: RECEIVER,
                to: TARGET_PATH + deployConfig.debug[ i ]
            } )
        ]
    } )
    // 
    .match( "**.{png,jpg,gif}", {
        useHash: true,
        release: namespace + "/static/images/$0", //  /static 
        useSprite: false,
        deploy: [ fis.plugin( "skip-packed" ),
            fis.plugin( "http-push", {
                receiver: RECEIVER,
                to: TARGET_PATH + deployConfig.debug[ i ]
            } )
        ]
    } )

}

what result do you expect? What is the error message actually seen?

how to change files or NPM introduced to a third party in the configuration, such as mint-ui

Apr.09,2021

use fis3-hook to introduce the modules package, and you can use mint-ui directly. Because fis3 is not compatible with some NPM, you need to introduce the mint-ui style into index.html separately.

Menu