https://github.com/jwygithub/vue-cli-plugin-inject-style
automatically introduce styles on a single page based on the path
https://github.com/jwygithub/vue-cli-plugin-inject-style
vue vue-cli
Last synced: 5 months ago
JSON representation
automatically introduce styles on a single page based on the path
- Host: GitHub
- URL: https://github.com/jwygithub/vue-cli-plugin-inject-style
- Owner: jwyGithub
- License: mit
- Created: 2020-01-02T03:15:48.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2024-10-15T06:04:38.000Z (over 1 year ago)
- Last Synced: 2025-04-14T09:17:43.197Z (about 1 year ago)
- Topics: vue, vue-cli
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/vue-cli-plugin-inject-style
- Size: 2.78 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# vue-cli-plugin-inject-style
automatically inject style files based on the style path
## Install
### with pnpm
```sh
pnpm add vue-cli-plugin-inject-style -D
```
### with yarn
```sh
yarn add vue-cli-plugin-inject-style -D
```
### with npm
```sh
npm install vue-cli-plugin-inject-style -D
```
### with vue
```sh
vue add vue-cli-plugin-inject-style
```
## Option
```typescript
export interface InjectStyle {
/**
* @description style root
* @default src/style
*/
path: string;
/**
* @description style suffix
* @default ["scss","less"]
*/
suffixs: suffix[];
}
```
## Config
```javascript
// vue.config.js
const path = require('node:path');
const { defineConfig } = require('@vue/cli-service');
module.exports = defineConfig({
transpileDependencies: true,
css: {
sourceMap: false,
loaderOptions: {
// manual add
scss: {
additionalData: '@import "~@/styles/index.scss";'
}
}
},
pluginOptions: {
'vue-cli-plugin-inject-style': {
path: path.join(__dirname, 'src', 'style'),
suffixs: ['scss', 'less']
}
}
});
```