refactor: remove most sass usage

.eslintrc.js

@@ -19,10 +19,6 @@ module.exports = {
     'vue/valid-v-model': 0
   },
   overrides: [
-    {
-      files: 'src/_icons/**/*',
-      rules: {}
-    },
     {
       files: '*.spec.js',
       globals: {

demo/Site.vue

@@ -67,7 +67,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style scoped>
 .demo {
   z-index: auto;
   position: absolute;
@@ -77,9 +77,6 @@ export default {
   bottom: 0;
   min-width: 1080px;
 }
-</style>
-
-<style lang="scss">
 body {
   -webkit-text-size-adjust: 100%;
 }

demo/SiteHeader.vue

@@ -225,7 +225,7 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style scoped>
 .nav {
   display: grid;
   grid-template-columns: 288px 1fr auto 32px;
@@ -255,8 +255,9 @@ export default {
 .nav-picker {
   cursor: pointer;
   margin-right: 12px;
-  &:last-child {
-    margin-right: 0;
-  }
+}
+
+.nav-picker:last-child {
+  margin-right: 0;
 }
 </style>

demo/documentation/components/icon/zhCN/icons.vue

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-import icons from '../../../../../src/_icons/index'
+import icons from '../../../../../src/_deprecated/icons/index'
 import iconWrapper from './iconWrapper'
 import { modeRef } from '../../../../use-dev-mode'
 

demo/font.js

@@ -1,2 +1,2 @@
-import '../src/fonts/OpenSans.scss'
-import '../src/fonts/FiraCode.scss'
+import '../src/fonts/OpenSans.css'
+import '../src/fonts/FiraCode.css'

demo/init.js

@@ -4,7 +4,7 @@ import ComponentDocumentation from './utils/ComponentDocumentation.vue'
 import DocumentationWrapper from './utils/DocumentationWrapper.vue'
 import EditOnGithubButton from './utils/EditOnGithubButton.vue'
 import EditOnGithubHeader from './utils/EditOnGithubHeader.vue'
-import './styles/demo.scss'
+import './styles/demo.css'
 
 export function installDemoComponents (app) {
   app.component('ComponentDemo', ComponentDemo)

demo/styles/demo.css

@@ -1,4 +1,4 @@
-@import 'Metropolis.scss';
+@import 'Metropolis.css';
 
 body {
   overflow: hidden;

demo/utils/EditOnGithubButton.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script>
-import editIcon from '../../src/_icons/git-commit-outline.vue'
+import editIcon from '../../src/_deprecated/icons/git-commit-outline.vue'
 import githubUrl from './github-url'
 
 export default {

package.json

@@ -103,6 +103,7 @@
     "rollup": "^2.32.1",
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-vue": "^6.0.0-beta.10",
+    "sass": "^1.28.0",
     "sass-loader": "^7.3.1",
     "schema-utils": "^1.0.0",
     "sinon": "^7.5.0",

rollup.config.js

@@ -8,7 +8,7 @@ module.exports = {
     {
       format: 'cjs',
       dir: 'lib',
-      exports: 'named',
+      exports: 'auto',
       preserveModules: true
     },
     {

src/collapse/src/CollapseItem.vue

@@ -39,7 +39,7 @@
 <script>
 import { toRef } from 'vue'
 import NIcon from '../../icon'
-import ArrowIcon from '../../_icons/ios-arrow-forward.vue'
+import ArrowIcon from '../../_deprecated/icons/ios-arrow-forward.vue'
 import NCollapseItemContent from './CollapseItemContent.js'
 import { useInjectionCollection } from '../../_utils/composition'
 

src/dynamic-input/src/DynamicInput.vue

@@ -48,8 +48,8 @@
 <script>
 import NButton from '../../button'
 import NButtonGroup from '../../button-group'
-import mdAdd from '../../_icons/md-add.vue'
-import mdRemove from '../../_icons/md-remove.vue'
+import mdAdd from '../../_deprecated/icons/md-add.vue'
+import mdRemove from '../../_deprecated/icons/md-remove.vue'
 import NDynamicInputInputPreset from './InputPreset.vue'
 import NDynamicInputPairPreset from './PairPreset.vue'
 import withapp from '../../_mixins/withapp'

src/dynamic-tags/src/DynamicTags.vue

@@ -43,7 +43,7 @@
 <script>
 import NTag from '../../tag'
 import NIcon from '../../icon'
-import AddIcon from '../../_icons/add-outline.vue'
+import AddIcon from '../../_deprecated/icons/add-outline.vue'
 import withapp from '../../_mixins/withapp'
 import themeable from '../../_mixins/themeable'
 import asformitem from '../../_mixins/asformitem'

src/empty/src/Empty.vue

@@ -29,7 +29,7 @@
 import withapp from '../../_mixins/withapp'
 import themeable from '../../_mixins/themeable'
 import locale from '../../_mixins/locale'
-import removeCircleOutline from '../../_icons/remove-circle-outline.vue'
+import removeCircleOutline from '../../_deprecated/icons/remove-circle-outline.vue'
 import NIcon from '../../icon'
 import usecssr from '../../_mixins/usecssr'
 import styles from './styles/index'

src/input-number/src/InputNumber.vue

@@ -61,8 +61,8 @@
 
 <script>
 import NIcon from '../../icon/index'
-import RemoveIcon from '../../_icons/remove-outline.vue'
-import AddIcon from '../../_icons/add-outline.vue'
+import RemoveIcon from '../../_deprecated/icons/remove-outline.vue'
+import AddIcon from '../../_deprecated/icons/add-outline.vue'
 import {
   configurable,
   themeable,

src/tabs/src/Tabs.vue

@@ -97,9 +97,9 @@ import {
   themeable,
   usecssr
 } from '../../_mixins'
-import BackwardIcon from '../../_icons/ios-arrow-back.vue'
-import ForwardIcon from '../../_icons/ios-arrow-forward.vue'
-import CloseIcon from '../../_icons/md-close.vue'
+import BackwardIcon from '../../_deprecated/icons/ios-arrow-back.vue'
+import ForwardIcon from '../../_deprecated/icons/ios-arrow-forward.vue'
+import CloseIcon from '../../_deprecated/icons/md-close.vue'
 import { VResizeObserver } from 'vueuc'
 import { throttle } from 'lodash-es'
 import styles from './styles'

src/time-picker/src/TimePicker.vue

@@ -208,7 +208,7 @@ import {
 import { strictParse } from '../../date-picker/src/utils'
 import keyboardDelegate from '../../_utils/delegate/keyboardDelegate'
 import NBaseFocusDetector from '../../_base/focus-detector'
-import TimeIcon from '../../_icons/time-outline.vue'
+import TimeIcon from '../../_deprecated/icons/time-outline.vue'
 import styles from './styles'
 import { warn, call, KEY_CODE } from '../../_utils'
 

src/transfer/src/Transfer.vue

@@ -202,7 +202,7 @@ import NTransferButton from './TransferButton.vue'
 import NInput from '../../input'
 import NIcon from '../../icon'
 import NEmpty from '../../empty'
-import SearchIcon from '../../_icons/ios-search.vue'
+import SearchIcon from '../../_deprecated/icons/ios-search.vue'
 import {
   configurable,
   asformitem,

src/tree/src/TreeNodeSwitcher.vue

@@ -19,7 +19,7 @@
 </template>
 
 <script>
-import mdArrowDropright from '../../_icons/md-arrow-dropright.vue'
+import mdArrowDropright from '../../_deprecated/icons/md-arrow-dropright.vue'
 import NBaseLoading from '../../_base/loading'
 import NIconSwitchTransition from '../../_transition/IconSwitchTransition'
 

src/upload/src/UploadFile.vue

@@ -57,11 +57,11 @@
 
 <script>
 import NButton from '../../button'
-import closeOutline from '../../_icons/close-outline.vue'
-import downloadOutline from '../../_icons/download-outline.vue'
-import trashOutline from '../../_icons/trash-outline.vue'
+import closeOutline from '../../_deprecated/icons/close-outline.vue'
+import downloadOutline from '../../_deprecated/icons/download-outline.vue'
+import trashOutline from '../../_deprecated/icons/trash-outline.vue'
 import NUploadProgress from './UploadProgress.vue'
-import attachOutline from '../../_icons/attach-outline.vue'
+import attachOutline from '../../_deprecated/icons/attach-outline.vue'
 import NIcon from '../../icon'
 import NIconSwitchTransition from '../../_transition/IconSwitchTransition'
 import { warn } from '../../_utils/naive'

vite.config.js

@@ -6,11 +6,16 @@ module.exports = {
   root: __dirname,
   plugins: [ mdPlugin() ],
   optimizeDeps: {
-    include: ['highlight.js/lib/languages/cpp', 'highlight.js/lib/highlight',
-      'highlight.js/lib/languages/javascript', 'highlight.js/lib/languages/python', 'vooks']
+    include: [
+      'highlight.js/lib/languages/cpp',
+      'highlight.js/lib/highlight',
+      'highlight.js/lib/languages/javascript',
+      'highlight.js/lib/languages/python',
+      'vooks'
+    ]
   },
   alias: {
-    '/@naive-ui/lib/icons/': path.resolve(__dirname, './src/_icons'),
+    '/@naive-ui/lib/icons/': path.resolve(__dirname, './src/_deprecated/icons'),
     '/@naive-ui/': path.resolve(__dirname, './src'),
     'src': path.resolve(__dirname, './src')
   },

vue3.md

@@ -298,7 +298,7 @@ placeable 进行了大调整
     - unify composition
   - remove hollowoutable
   - vite-build
-  - rollup-build
+  - [x] rollup-build
     - [ ] wait for new version of rollup-plugin-vue,
       https://github.com/vuejs/rollup-plugin-vue/issues/408
   - tusimple theme
@@ -313,3 +313,6 @@ placeable 进行了大调整
   - nimbus icon
 
 `naive-ui/lib/styles/fonts/X.css` => `naive-ui/fonts/X.css`
+deprecate
+`naive-ui/lib/icons` => `vicons`
+`naive-ui/es/icons` => `vicons`