Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
3.5k views
in Technique[技术] by (71.8m points)

vue中开发生产环境配置不同的组件,如何做

vue里,我想在开发环境要sidebar组件,打包生产环境不要它,置空,如何做呢
<div>

<sidebar></sidebar>

</div>

mounted(){
process.env.NODE_ENV === 'production' 这里怎么做

}


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

楼上说的方法都挺好的.

1.

<sidebar v-if="show"></sidebar>
computed:{
    show() {
        return process.env.NODE_ENV === 'production'
    }
}

2.

//sidebar.vue
render() {
    return process.env.NODE_ENV === 'production' ? null : '你的组件'
}

3.
自定义指令,自定义指令对于多个组件都有这个逻辑会方便一点

    Vue.directive('hasSide', {
        inserted(el, binding, vnode) {
            if (process.env.NODE_ENV === 'production') {
                el.parentNode.removeChild(el)
            }
        }
    })

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...