Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add composition-api to features #759

Open
wants to merge 5 commits into
base: master
Choose a base branch
from
Open

feat: add composition-api to features #759

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
2b5f8c9
feat: add composition-api to features
ChangJoo-Park Mar 23, 2021
4bfcdf4
feat: Add moduleNameMapper for testing
ChangJoo-Park Mar 25, 2021
a90b2d1
Merge remote-tracking branch 'origin/master' into ChangJoo-Park/master
danielroe May 31, 2021
b791dcc
chore: update composition api version
danielroe May 31, 2021
8c67640
feat: add example composition api usage
danielroe May 31, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ yarn create nuxt-app <my-project>
- [Axios - Promise based HTTP client](https://github.com/nuxt-community/axios-module)
- [Progressive Web App (PWA)](https://github.com/nuxt-community/pwa-module)
- [Content - Git-based headless CMS](https://github.com/nuxt/content)
- [Composition API - with Nuxt-specific features](https://composition-api.nuxtjs.org/)
1. Linting tools:
- [ESLint](https://github.com/nuxt/eslint-config)
- [Prettier](https://github.com/prettier/prettier)
Expand Down
7 changes: 6 additions & 1 deletion packages/cna-template/template/frameworks/jest/jest.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,12 @@ module.exports = {
moduleNameMapper: {
'^@/(.*)$': '<rootDir>/$1',
'^~/(.*)$': '<rootDir>/$1',
'^vue$': 'vue/dist/vue.common.js'
'^vue$': 'vue/dist/vue.common.js',
<%_ if (composition) { _%>
'@nuxtjs/composition-api': '@nuxtjs/composition-api/lib/entrypoint.js',
// alternatively, depending on your node version
// '@nuxtjs/composition-api': '@nuxtjs/composition-api/entrypoint',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would recommend defaulting to this one as newer node versions will only recognise this format

Copy link
Member

@clarkdo clarkdo Mar 25, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think the first should work as we have "./": "./" in exports of @nuxtjs/composition-api ? Not aware it's in nested dir lib, what do you think adding lib to exports as well ?

BTW, trailing "/" suffix for subpath will be removed in a future Node.js release.

Copy link
Member

@danielroe danielroe Mar 25, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point! Yes, but the trailing / is deprecated in favour of /*. 👍 to adding lib to exports in principle, though will need to check what happens with siroc.

<%_ } _%>
},
moduleFileExtensions: [
<%_ if (typescript) { _%>
Expand Down
4 changes: 4 additions & 0 deletions packages/cna-template/template/nuxt/nuxt.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,10 @@
// https://go.nuxtjs.dev/vuetify
'@nuxtjs/vuetify',
<%_ } _%>
<%_ if (composition) { _%>
// https://composition-api.nuxtjs.org/
'@nuxtjs/composition-api',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For testing in jest, let's add moduleNameMapper in jest config

moduleNameMapper: {
  '@nuxtjs/composition-api': '@nuxtjs/composition-api/lib/entrypoint.js',
  // alternatively, depending on your node version
  // '@nuxtjs/composition-api': '@nuxtjs/composition-api/entrypoint',
},

Copy link
Contributor Author

@ChangJoo-Park ChangJoo-Park Mar 25, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@clarkdo Good point 👍
Chech this commit please.

<%_ } _%>
],

// Modules: https://go.nuxtjs.dev/config-modules
Expand Down
3 changes: 3 additions & 0 deletions packages/cna-template/template/nuxt/package.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,9 @@ module.exports = {
if (!features.includes('content')) {
delete pkg.dependencies['@nuxt/content']
}
if (!features.includes('composition')) {
delete pkg.dependencies['@nuxtjs/composition-api']
}

// TS
const typescript = language.includes('ts')
Expand Down
1 change: 1 addition & 0 deletions packages/cna-template/template/nuxt/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
}
},
"dependencies": {
"@nuxtjs/composition-api": "^0.22.3",
"@nuxt/content": "^1.14.0",
"@nuxtjs/axios": "^5.13.1",
"@nuxtjs/pwa": "^3.3.5",
Expand Down
3 changes: 2 additions & 1 deletion packages/create-nuxt-app/lib/prompts.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,8 @@ module.exports = [
choices: [
{ name: 'Axios - Promise based HTTP client', value: 'axios' },
{ name: 'Progressive Web App (PWA)', value: 'pwa' },
{ name: 'Content - Git-based headless CMS', value: 'content' }
{ name: 'Content - Git-based headless CMS', value: 'content' },
{ name: 'Composition API - with Nuxt-specific features', value: 'composition' }
],
default: []
},
Expand Down
4 changes: 3 additions & 1 deletion packages/create-nuxt-app/lib/saofile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ module.exports = {
const commitlint = this.answers.linter.includes('commitlint')
const axios = this.answers.features.includes('axios')
const content = this.answers.features.includes('content')
const composition = this.answers.features.includes('composition')
const pm = this.answers.pm === 'yarn' ? 'yarn' : 'npm'
const pmRun = this.answers.pm === 'yarn' ? 'yarn' : 'npm run'

Expand All @@ -37,7 +38,8 @@ module.exports = {
edge,
pm,
pmRun,
content
content,
composition
}
},
actions () {
Expand Down
93 changes: 92 additions & 1 deletion packages/create-nuxt-app/test/snapshots/index.test.js.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1899,7 +1899,7 @@ Generated by [AVA](https://avajs.dev).
}␊
`

## verify features: Axios - Promise based HTTP client, Progressive Web App (PWA), Content - Git-based headless CMS
## verify features: Axios - Promise based HTTP client, Progressive Web App (PWA), Content - Git-based headless CMS, Composition API - with Nuxt-specific features

> Generated files

Expand Down Expand Up @@ -1931,6 +1931,7 @@ Generated by [AVA](https://avajs.dev).
dependencies: {
'@nuxt/content': '^1.14.0',
'@nuxtjs/axios': '^5.13.1',
'@nuxtjs/composition-api': '^0.22.3',
'@nuxtjs/pwa': '^3.3.5',
'core-js': '^3.9.1',
nuxt: '^2.15.3',
Expand Down Expand Up @@ -1974,6 +1975,8 @@ Generated by [AVA](https://avajs.dev).
␊
// Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules␊
buildModules: [␊
// https://composition-api.nuxtjs.org/␊
'@nuxtjs/composition-api',␊
],␊
␊
// Modules: https://go.nuxtjs.dev/config-modules␊
Expand Down Expand Up @@ -2281,6 +2284,94 @@ Generated by [AVA](https://avajs.dev).
}␊
`

## verify features: Composition API - with Nuxt-specific features

> Generated files

[
'.editorconfig',
'.gitignore',
'README.md',
'assets/README.md',
'components/Logo.vue',
'components/README.md',
'layouts/README.md',
'layouts/default.vue',
'middleware/README.md',
'nuxt.config.js',
'package.json',
'pages/README.md',
'pages/index.vue',
'plugins/README.md',
'static/README.md',
'static/favicon.ico',
'store/README.md',
]

> package.json

{
dependencies: {
'@nuxtjs/composition-api': '^0.22.3',
'core-js': '^3.9.1',
nuxt: '^2.15.3',
},
devDependencies: {},
private: true,
scripts: {
build: 'nuxt build',
dev: 'nuxt',
generate: 'nuxt generate',
start: 'nuxt start',
},
}

> Generated nuxt.config.js

`export default {␊
// Global page headers: https://go.nuxtjs.dev/config-head␊
head: {␊
title: 'output',␊
htmlAttrs: {␊
lang: 'en'␊
},␊
meta: [␊
{ charset: 'utf-8' },␊
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },␊
{ hid: 'description', name: 'description', content: '' }␊
],␊
link: [␊
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }␊
]␊
},␊
␊
// Global CSS: https://go.nuxtjs.dev/config-css␊
css: [␊
],␊
␊
// Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins␊
plugins: [␊
],␊
␊
// Auto import components: https://go.nuxtjs.dev/config-components␊
components: true,␊
␊
// Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules␊
buildModules: [␊
// https://composition-api.nuxtjs.org/␊
'@nuxtjs/composition-api',␊
],␊
␊
// Modules: https://go.nuxtjs.dev/config-modules␊
modules: [␊
],␊
␊
// Build Configuration: https://go.nuxtjs.dev/config-build␊
build: {␊
}␊
}␊
`

## verify linter: ESLint, Prettier, Lint staged files, StyleLint, Commitlint

> Generated files
Expand Down
Binary file modified packages/create-nuxt-app/test/snapshots/index.test.js.snap
View file
Open in desktop
Binary file not shown.