scss换为less

package.json

@@ -31,7 +31,8 @@
     "eslint-plugin-vue": "^7.0.0",
     "less": "^4.1.1",
     "less-loader": "^7.0.0",
-    "mobile-select": "^1.1.2"
+    "mobile-select": "^1.1.2",
+    "raw-loader": "^4.0.2"
   },
   "eslintConfig": {
     "root": false,

src/assets/less/utils.less

@@ -1,4 +1,3 @@
-@use "sass:math";
 
 
 ///*

src/components/BaseButton.vue

@@ -78,7 +78,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .button {
   color: white;

src/components/BaseHeader.vue

@@ -54,7 +54,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 #BaseHeader {
   width: 100%;

src/components/Check.vue

@@ -34,7 +34,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .check {
   @width: 1.4rem;

src/components/Comment.vue

@@ -319,7 +319,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .title {
   z-index: 2;

src/components/DouyinCode.vue

@@ -67,7 +67,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .DouyinCode {
   position: fixed;

src/components/Loading.vue

@@ -17,7 +17,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .Loading {
 

src/components/NoMore.vue

@@ -11,7 +11,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .NoMore {
   font-size: 1.2rem;

src/components/Scroll.vue

@@ -35,7 +35,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .scroll-wrapper {
   overflow: auto;

src/components/Search.vue

@@ -69,7 +69,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/color";
+@import "../assets/less/color";
 
 .search-ctn {
   display: flex;

src/components/Share.vue

@@ -225,7 +225,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .share {
   width: 100%;

src/components/Video.vue

@@ -345,7 +345,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/color";
+@import "../assets/less/color";
 
 .fade-enter-active,
 .fade-leave-active {

src/components/dialog/ConfirmDialog.vue

@@ -79,7 +79,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .ConfirmDialog {
   z-index: 10;

src/components/dialog/FadeDialog.vue

@@ -17,7 +17,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .FadeDialog {
   position: fixed;

src/components/dialog/FromBottomDialog.vue

@@ -192,7 +192,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .FromBottomDialog {
   z-index: 9;

src/components/dialog/NoticeDialog.vue

@@ -54,7 +54,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .NoticeDialog {
   z-index: 10;

src/components/slide/Indicator.vue

@@ -118,7 +118,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .indicator-ctn {
   font-size: 1.4rem;

src/components/slide/SlideColumnList.vue

@@ -327,7 +327,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #base-slide-wrapper {
   width: 100%;

src/components/slide/SlideColumnVirtualList.vue

@@ -305,7 +305,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #base-slide-wrapper {
   width: 100%;

src/components/slide/SlideList.vue

@@ -415,7 +415,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #base-slide-wrapper {
   width: 100%;

src/components/slide/SlideRowList.vue

@@ -344,7 +344,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #base-slide-wrapper {
   width: 100%;

src/main.js

@@ -1,7 +1,7 @@
 import * as Vue from 'vue'
 import App from './App.vue'
 import mitt from 'mitt'
-import './assets/scss/index.less'
+import './assets/less/index.less'
 import './mock'// 导入 mock 数据处理
 import api from './api'
 import router from "./router";

src/pages/Test.vue

@@ -30,7 +30,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 
 .Test {

src/pages/Test2.vue

@@ -120,7 +120,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .Test {
   position: fixed;

src/pages/Test3.vue

@@ -74,7 +74,7 @@ export default {
 </script>
 
 <style lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .test {
   position: fixed;

src/pages/Test4.vue

@@ -34,7 +34,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .Test {
   position: fixed;

src/pages/Test5.vue

@@ -202,7 +202,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../assets/scss/index";
+@import "../assets/less/index";
 
 .Test {
   position: fixed;

src/pages/home/Attention.vue

@@ -392,7 +392,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #attention {
   /*background: rgb(22，24，34);*/

src/pages/home/LivePage.vue

@@ -233,7 +233,7 @@ export default {
 </script>
 
 <style lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .send-gift {
   position: fixed;
@@ -404,7 +404,7 @@ export default {
 
 </style>
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .LivePage {
   width: 100vw;

src/pages/home/Music.vue

@@ -204,7 +204,7 @@ export default {
 
 <style scoped lang="less">
 
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #Music {
   position: fixed;

src/pages/home/MusicRankList.vue

@@ -422,7 +422,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .MusicRankList {
   position: fixed;

src/pages/home/Publish.vue

@@ -85,7 +85,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Publish {
   position: fixed;

src/pages/home/Report.vue

@@ -123,7 +123,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Report {
   position: fixed;

src/pages/home/SearchPage.vue

@@ -660,7 +660,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Search {
   position: fixed;

src/pages/home/SubmitReport.vue

@@ -71,7 +71,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Report {
   position: fixed;

src/pages/home/components/Duoshan.vue

@@ -49,7 +49,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .share-to-duoshan {
   padding: 3rem 2rem;

src/pages/home/components/FollowSetting.vue

@@ -88,7 +88,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .follow-setting-dialog {
   padding: 1.5rem;

src/pages/home/components/FollowSetting2.vue

@@ -71,7 +71,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .follow-setting-dialog {
   padding: 1.5rem;

src/pages/home/components/PlayFeedback.vue

@@ -118,7 +118,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .play-feedback {
   max-height: 49rem;

src/pages/home/components/ShareTo.vue

@@ -231,7 +231,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .option-dialog {
   .buttons {

src/pages/home/components/ShareToFriend.vue

@@ -163,7 +163,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .button {
   width: 6.4rem;

src/pages/login/Base.less

@@ -1,4 +1,4 @@
-@import "../../assets/scss/index";
+@import "../../assets/less/index.less";
 
 .content {
   padding: 3rem;

src/pages/login/Help.vue

@@ -28,7 +28,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Help {
   position: fixed;

src/pages/login/Login.vue

@@ -95,7 +95,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .login {
   position: fixed;

src/pages/login/OtherLogin.vue

@@ -116,8 +116,8 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
-@import "Base.scss";
+@import "../../assets/less/index";
+@import "Base.less";
 
 .other-login {
   position: fixed;

src/pages/login/PasswordLogin.vue

@@ -85,8 +85,8 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
-@import "Base.scss";
+@import "../../assets/less/index";
+@import "Base.less";
 
 .PasswordLogin {
   position: fixed;

src/pages/login/RetrievePassword.vue

@@ -129,8 +129,8 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
-@import "Base.scss";
+@import "../../assets/less/index";
+@import "Base.less";
 
 .RetrievePassword {
   position: fixed;

src/pages/login/VerificationCode.vue

@@ -91,8 +91,8 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
-@import "Base.scss";
+@import "../../assets/less/index";
+@import "Base.less";
 
 .VerificationCode {
   position: fixed;

src/pages/login/components/LoginInput.vue

@@ -116,7 +116,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .input-number {
   display: flex;

src/pages/login/components/Tooltip.vue

@@ -26,7 +26,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .scale-enter-active,
 .scale-leave-active {

src/pages/login/countryChoose.vue

@@ -2433,7 +2433,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .countryChoose {
   position: fixed;

src/pages/me/Me.less

@@ -1,4 +1,4 @@
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .fade1-enter-active,
 .fade1-leave-active {

src/pages/me/MyCard.vue

@@ -117,7 +117,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 #MyCard {
   background: rgb(136, 132, 133);

src/pages/me/MyMusic.vue

@@ -74,7 +74,8 @@
 import {mapState} from "vuex";
 import globalMethods from "../../utils/global-methods";
 import {nextTick} from "vue";
-import lyricsFaruxue from '../../assets/data/lyrics/faruxue.txt'
+// import lyricsFaruxue from '../../assets/data/lyrics/faruxue.txt'
+import lyricsFaruxue from '../../assets/data/lyrics/faruxue.lrc'
 
 
 export default {
@@ -258,7 +259,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .MyMusic {
   position: fixed;

src/pages/me/RequestUpdate.vue

@@ -76,7 +76,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .RequestUpdate {
   position: fixed;

src/pages/me/Uploader.less

@@ -1,4 +1,4 @@
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .fade1-enter-active,
 .fade1-leave-active {

src/pages/me/VideoDetail.vue

@@ -374,7 +374,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 
 #video-detail {

src/pages/me/collect/MusicCollect.vue

@@ -133,7 +133,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "@/assets/scss/index";
+@import "@/assets/less/index";
 
 .MusicCollect {
   position: fixed;

src/pages/me/collect/VideoCollect.vue

@@ -37,7 +37,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .VideoCollect {
   position: fixed;

src/pages/me/rightMenu/LookHistory.vue

@@ -64,7 +64,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .lookHistory {
   position: fixed;

src/pages/me/rightMenu/MinorProtection/DetailSetting.vue

@@ -86,7 +86,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../../assets/scss/index";
+@import "../../../../assets/less/index";
 
 .DetailSetting {
   position: fixed;

src/pages/me/rightMenu/MinorProtection/Index.vue

@@ -44,7 +44,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../../assets/scss/index";
+@import "../../../../assets/less/index";
 
 .index {
   position: fixed;

src/pages/me/rightMenu/MinorProtection/TriggerTime.vue

@@ -57,7 +57,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../../assets/scss/index";
+@import "../../../../assets/less/index";
 
 .TriggerTime {
   position: fixed;

src/pages/me/rightMenu/Setting.vue

@@ -198,7 +198,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .Setting {
   position: fixed;

src/pages/me/userinfo/AddSchool.vue

@@ -162,7 +162,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .school {
   position: fixed;

src/pages/me/userinfo/ChooseCity.vue

@@ -67,7 +67,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .choose-location {
   position: fixed;

src/pages/me/userinfo/ChooseDepartment.vue

@@ -52,7 +52,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .choose-school {
   position: fixed;

src/pages/me/userinfo/ChooseLocation.vue

@@ -1206,7 +1206,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .choose-location {
   position: fixed;

src/pages/me/userinfo/ChooseProvince.vue

@@ -36,7 +36,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .choose-location {
   position: fixed;

src/pages/me/userinfo/ChooseSchool.vue

@@ -97,7 +97,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .choose-school {
   position: fixed;

src/pages/me/userinfo/DeclareSchool.vue

@@ -58,7 +58,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .declare-school {
   position: fixed;

src/pages/me/userinfo/DisplayType.vue

@@ -52,7 +52,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .DisplayType {
   position: fixed;

src/pages/me/userinfo/EditUserInfo.vue

@@ -147,7 +147,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .edit {
   position: fixed;

src/pages/me/userinfo/EditUserInfoItem.vue

@@ -104,7 +104,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .edit-item {
   position: fixed;

src/pages/message/Chat.vue

@@ -387,7 +387,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Chat {
   position: fixed;

src/pages/message/ChatDetail.vue

@@ -89,7 +89,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .ChatDetail {
   position: fixed;

src/pages/message/JoinedGroupChat.vue

@@ -87,7 +87,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Share2Friend {
   position: fixed;

src/pages/message/Message.vue

@@ -239,7 +239,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 ::-webkit-scrollbar {
   display: none; /* Chrome Safari */

src/pages/message/SetRemark.vue

@@ -63,7 +63,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .edit-item {
   position: fixed;

src/pages/message/Share2Friend.vue

@@ -323,7 +323,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Share2Friend {
   position: fixed;

src/pages/message/components/BlockDialog.vue

@@ -42,7 +42,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .block-dialog {
   color: black;

src/pages/message/components/ChatMessage.vue

@@ -160,7 +160,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .ChatMessage {
   padding: 0 1rem;

src/pages/other/ServiceProtocol.vue

@@ -1723,7 +1723,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .ServiceProtocol {
   position: fixed;

src/pages/people/AddressList.vue

@@ -44,7 +44,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .AddressList {
   position: fixed;

src/pages/people/FaceToFace.vue

@@ -24,7 +24,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .FaceToFace {
   background: black;

src/pages/people/FindAcquaintance.vue

@@ -201,7 +201,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .from-bottom-enter-active,
 .from-bottom-leave-active {

src/pages/people/Scan.vue

@@ -38,7 +38,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../assets/scss/index";
+@import "../../assets/less/index";
 
 .Scan {
   position: fixed;

src/pages/people/components/People.vue

@@ -71,7 +71,7 @@ export default {
 </script>
 
 <style scoped lang="less">
-@import "../../../assets/scss/index";
+@import "../../../assets/less/index";
 
 .scale-enter-active,
 .scale-leave-active {

vue.config.js

@@ -1,12 +1,35 @@
 // vue.config.js
+const path = require('path')
+
 const isProduction = process.env.NODE_ENV === 'production'
 
 module.exports = {
   publicPath: isProduction ? '' : '',
   assetsDir: isProduction ? './' : './',
   // productionSourceMap: false,
-  lintOnSave:false, //关闭eslint检查
-  devServer:{
+  lintOnSave: false, //关闭eslint检查
+  devServer: {
     open: true,
+  },
+  // chainWebpack: config => {
+  //   config.module
+  //     .rule('txt')
+  //     .test( /\.(txt|lrc)$/)
+  //     .use('raw-loader')
+  //     .loader('raw-loader')
+  //     .end()
+  // },
+  configureWebpack: {
+    module: {
+      rules: [
+        {
+          //解析txt、lrc文件
+          test: /\.(txt|lrc)$/,
+          exclude: /node_modules/,
+          include: path.join(__dirname, 'src'),
+          use: ['raw-loader']
+        }
+      ]
+    },
   }
 }