diff --git a/nuxt.config.ts b/nuxt.config.ts index e363792..cc73e9c 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -61,6 +61,8 @@ module.exports = { // Doc: https://axios.nuxtjs.org/usage '@nuxtjs/axios', '@nuxtjs/pwa', + // https://github.com/nuxt-community/style-resources-module/ + '@nuxtjs/style-resources', // https://github.com/potato4d/nuxt-client-init-module // https://qiita.com/potato4d/items/cc5d8ea24949e86f8a5b 'nuxt-client-init-module', @@ -132,5 +134,8 @@ module.exports = { component: resolve(__dirname, 'src/include/include.vue') }) } + }, + styleResources: { + scss: ['@/assets/styles/components/**/*.scss'] } } diff --git a/package.json b/package.json index dba97eb..d18c514 100644 --- a/package.json +++ b/package.json @@ -63,6 +63,7 @@ }, "devDependencies": { "@nuxtjs/eslint-config": "^0.0.1", + "@nuxtjs/style-resources": "^0.1.2", "@storybook/vue": "^4.1.13", "@types/babel-core": "6.25.6", "@types/eslint": "^4.16.6", diff --git a/src/assets/styles/components/sample.scss b/src/assets/styles/components/sample.scss new file mode 100644 index 0000000..fe57fda --- /dev/null +++ b/src/assets/styles/components/sample.scss @@ -0,0 +1,3 @@ +.color { + color: aqua; +} diff --git a/src/pages/example/extend-css-class.vue b/src/pages/example/extend-css-class.vue new file mode 100644 index 0000000..043a8ab --- /dev/null +++ b/src/pages/example/extend-css-class.vue @@ -0,0 +1,34 @@ + + + + + diff --git a/src/pages/example/index.vue b/src/pages/example/index.vue index 4a28077..521e8c4 100644 --- a/src/pages/example/index.vue +++ b/src/pages/example/index.vue @@ -44,6 +44,9 @@ p nuxt-link(to='/example/type-safe-vuex') | type-safe-vuex + p + nuxt-link(to='/example/extend-css-class') + | extend-css-class