分离vue或者uni-app的js和css

311 阅读1分钟

方法

挺简单的,就是利用下ES6的import和export

index.vue 基础代码

<!--界面代码-->
<template>
  <div class="mockDataTestView">
    mockDataTestView
  </div>
</template>
 
<!--这里引入分离的业务js代码-->
<script>
import indexjs from './index.js'
export default {
  ...indexjs,
}
</script>
 
<!--这里引入分离的界面样式代码-->
<style lang="scss" scoped>
@import './index.scss';
</style>

css正常写; index.js 基础代码

export default {
  name: 'mockDataTestView',
  data() {
    return {
 
    }
  },
  mounted() {
  },
  created() {},
  methods: {
  },
  watch: {
  }
}

拓展
上述是针对vue2、js、scss的方式,vue3、typescript也是可以的