鍍金池/ 問答/HTML5  PHP  HTML/ vue:如何配置 sass 提供頁面換膚功能

vue:如何配置 sass 提供頁面換膚功能

需求大概是這樣的:
頁面有三個版本,不同版本有不同的主題色以及背景圖,如何在vue中配置sass,打包完成以后,根據(jù)后臺傳遞參數(shù),修改皮膚

回答
編輯回答
夕顏

gulp 根據(jù)sass 配置文件 也就是 顏色全局變量, 打包出三套皮膚,線上代碼動態(tài)切換link src

2017年5月2日 01:00
編輯回答
夢若殤

后臺傳參數(shù),大概的意思是不是用戶可以個性化配置,主題色和背景單獨(dú)寫一個sass,可以在new一個vm實(shí)例之前使用Vue.http 請求一個主題參數(shù),在入口文件中可以用 if()條件的方式require

        var axios_instance = axios.create({
            transformRequest: [function(data) {
                data = Qs.stringify(data);
                return data;
            }],
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        })
        Vue.prototype.$http = axios;
        Vue.use(VueAxios, axios_instance);
        
        Vue.use(Vuex);
        Vue.axios.get('https://api.douban.com/v2/book/search', {
            params: { //請求參數(shù),接口是借用豆瓣的開放api
                q: 'java' 
            }
        }).then(res => {
            if (res.status == 200) { //條件根據(jù)用戶的配置來調(diào)整
                require('./.../theme.sass'); // 引用sass
            }
        })
        const vm = new Vue({
            el: '#app',
            router,
            store,
            render: h => h(App)
        });

親測通過,引用的代碼有點(diǎn)多

2018年7月1日 07:22
編輯回答
解夏

有插件呢吧應(yīng)該

2018年5月22日 00:46