-
Notifications
You must be signed in to change notification settings - Fork 457
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #3165 from vuestorefront/v2
chore: automatic sync v2->v2-develop
- Loading branch information
Showing
20 changed files
with
252 additions
and
96 deletions.
There are no files selected for viewing
39 changes: 39 additions & 0 deletions
39
.yarn/patches/@nuxt-module-builder-npm-0.6.0-755acb37c3.patch
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,39 @@ | ||
| diff --git a/dist/chunks/build.mjs b/dist/chunks/build.mjs | ||
| index 103067eb77b600e58143d0f1ab9eeb570a882af5..b88a7d7d435df0c1348a1ec821fbdcb16340f9c6 100644 | ||
| --- a/dist/chunks/build.mjs | ||
| +++ b/dist/chunks/build.mjs | ||
| @@ -1,6 +1,7 @@ | ||
| import { promises, existsSync } from 'node:fs'; | ||
| import { pathToFileURL } from 'node:url'; | ||
| -import { resolve, dirname } from 'pathe'; | ||
| +import { createRequire } from 'node:module'; | ||
| +import { resolve, isAbsolute } from 'pathe'; | ||
| import { readPackageJSON, readTSConfig } from 'pkg-types'; | ||
| import { defu } from 'defu'; | ||
| import { consola } from 'consola'; | ||
| @@ -210,7 +211,24 @@ async function loadTSCompilerOptions(path) { | ||
| }); | ||
| } | ||
| const files = Array.isArray(config.extends) ? config.extends : config.extends ? [config.extends] : []; | ||
| - return defu(config.compilerOptions, ...await Promise.all(files.map((file) => loadTSCompilerOptions(dirname(resolve(path, file)))))); | ||
| + return defu(config.compilerOptions, ...await Promise.all(files.map((file) => loadTSCompilerOptions(resolveExtends(file, path))))); | ||
| } | ||
|
|
||
| +function resolveExtends(extended, from) { | ||
| + // see https://github.com/dominikg/tsconfck/issues/149 | ||
| + if (extended === '..') extended = '../tsconfig.json'; | ||
| + const req = createRequire(from); | ||
| + let error; | ||
| + try { | ||
| + return req.resolve(extended); | ||
| + } catch (e) { | ||
| + error = e; | ||
| + } | ||
| + if (extended[0] !== '.' && !isAbsolute(extended)) { | ||
| + return req.resolve(`${extended}/tsconfig.json`); | ||
| + } | ||
| + | ||
| + throw error; | ||
| + } | ||
| + | ||
| export { build as default }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,6 @@ | ||
| node_modules | ||
| .output | ||
| playground | ||
| playground/** | ||
| dist | ||
| .eslintrc.cjs |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| module.exports = { | ||
| extends: ['plugin:nuxt/recommended', '@storefront-ui/eslint-config/vue.js'], | ||
| parserOptions: { | ||
| project: 'tsconfig.json', | ||
| tsconfigRootDir: __dirname, | ||
| sourceType: 'module', | ||
| }, | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,64 @@ | ||
|
|
||
| ### Install all dependencies | ||
|
|
||
| With Nuxt 3, the fastest way to get started is to use the `@storefront-ui/nuxt` module. The [Storefront-io Nuxt module](https://www.npmjs.com/package/@storefront-ui/nuxt) will automatically install `@nuxtjs/tailwindcss` and storefront-ui tailwindcss presets. | ||
|
|
||
| Additionally, you'll need to install the Storefront UI's Vue library and NuxtJs Tailwindcss Module. | ||
|
|
||
| ```bash | ||
| # npm | ||
| npm i -D @storefront-ui/nuxt @storefront-ui/vue @nuxtjs/tailwindcss | ||
|
|
||
| # yarn | ||
| yarn add -D @storefront-ui/nuxt @storefront-ui/vue @nuxtjs/tailwindcss | ||
|
|
||
| # pnpm | ||
| pnpm add -D @storefront-ui/nuxt @storefront-ui/vue @nuxtjs/tailwindcss | ||
| ``` | ||
|
|
||
| ### Add the Nuxt Tailwind module to your `nuxt.config.ts` | ||
|
|
||
| ```ts | ||
| // nuxt.config.ts | ||
| export default defineNuxtConfig({ | ||
| modules: ['@storefront-ui/nuxt'] | ||
| }) | ||
| ``` | ||
|
|
||
| ### Tailwind configuration | ||
|
|
||
| Since we use `@nuxtjs/tailwindcss` under the hood, there is possibility to use `tailwindcss` property in `nuxt.config.ts` file. Other than that there is default `tailwind` way to create config via `tailwind.config.ts` file. | ||
|
|
||
| Priority of reading configuration, in most important from top to bottom: | ||
|
|
||
| 1. `tailwind.config.ts` file | ||
| 2. `nuxt.config.ts` file with `tailwindcss` property | ||
| 3. default configuration inside module | ||
|
|
||
| ::tip Add a path to your installed package | ||
| In order for Tailwind to properly detect the utility classes used in Storefront UI components, you need to add a path to wherever your `node_modules` folder is located to the `content` property. In the example below, we're using the default location for `node_modules`, but this may change if you're working in a monorepo. | ||
| :: | ||
|
|
||
| ```ts | ||
| // tailwind.config.ts | ||
| import type { Config } from 'tailwindcss'; | ||
|
|
||
| export default <Config>{ | ||
| content: ['./**/*.vue', './node_modules/@storefront-ui/vue/**/*.{js,mjs}'], | ||
| }; | ||
| ``` | ||
|
|
||
| ### Custom `tailwind.css` file | ||
|
|
||
| If you're going to create your own Tailwind CSS file, make sure to add the @tailwind directives for each of Tailwind’s layer types (base, components, and utilities). | ||
|
|
||
| ```css | ||
| /* ~/assets/css/tailwind.css */ | ||
| @tailwind base; | ||
| @tailwind components; | ||
| @tailwind utilities; | ||
| ``` | ||
|
|
||
| ### You're ready to go | ||
|
|
||
| Now, you can import Storefront UI components in your app and all the Tailwind utilities from the `@storefront-ui/vue` library will be available in your project. Because `storefront-ui` is served as well from module, `@storefront-ui/vue` is available from [nuxt autoimport](https://nuxt.com/docs/guide/concepts/auto-imports). |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.