codesandbox-nuxt
Nuxt starter for CodeSandBox (used for https://template.nuxtjs.org)
Build Setup
# install dependencies
$ yarn install
# serve with hot reload at localhost:3000
$ yarn run dev
# build for production and launch server
$ yarn run build
$ yarn start
# generate static project
$ yarn run generate
For detailed explanation on how things work, checkout Nuxt.js docs.
For ESLint config
https://typescript.nuxtjs.org/guide/lint/
https://www.npmjs.com/package/eslint-plugin-prettier
https://eslint.vuejs.org/rules/
{
# ...
"plugins": [
"eslint-plugin-prettier",
"prettier"
],
"extends": [
# 1st set
"eslint:recommended",
"@nuxtjs/eslint-config-typescript",
"plugin:vue/recommended",
"plugin:prettier/recommended"
# or 2nd set
"plugin:vue/recommended",
"eslint:recommended",
"prettier/vue",
"plugin:prettier/recommended"
],
"rules": {}
}
{
"root": true,
"parserOptions": {
"parser": "@babel/eslint-parser",
"requireConfigFile": false,
"sourceType": "module",
"tsconfigRootDir": "./",
"project": {
"extends": "./tsconfig.json",
"include": ["src/**/*.{js, ts, vue}"]
}
},
"env": {
"browser": true,
"node": true,
"amd": true,
"es6": true
},
"extends": [
"@nuxtjs/eslint-config-typescript",
"prettier",
"plugin:prettier/recommended"
],
"plugins": [],
"rules": {}
}
{
"root": true,
"parserOptions": {
"requireConfigFile": false,
"sourceType": "module",
"tsconfigRootDir": "./",
"project": {
"extends": "./tsconfig.json",
"include": ["src/**/*.{js, ts, vue}"]
}
},
"env": {
"browser": true,
"node": true,
"amd": true,
"es6": true
},
"extends": [
"@nuxtjs/eslint-config-typescript",
"eslint:recommended",
"plugin:vue/strongly-recommended",
"plugin:prettier/recommended"
],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": ["error"]
}
}
{
"root": true,
"parser": "@typescript-eslint/parser",
"parserOptions": {
"tsconfigRootDir": ".",
"requireConfigFile": false,
"sourceType": "module",
"project": {
"extends": "./tsconfig.json"
},
"extraFileExtensions": [".vue"],
"allowImportExportEverywhere": true
},
"env": {
"browser": true,
"node": true,
"amd": true,
"es6": true
},
"plugins": ["@typescript-eslint", "vue", "prettier"],
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"@nuxtjs/eslint-config-typescript", // will enable this parser: @typescript-eslint/parser
"plugin:vue/recommended", //https://eslint.vuejs.org/user-guide/#usage -- not supporting @Decorators
"plugin:prettier/recommended",
"prettier"
],
"rules": {
"prettier/prettier": ["error"]
}
}
{
"name": "vue-nuxt-typescript-decorators",
"version": "1.0.0",
"description": "vue/nuxt + typescript + decorators",
"author": "Nuxt.js Team",
"private": true,
"scripts": {
"dev": "MINIMAL=1 nuxt-ts",
"build": "nuxt-ts build",
"lint": "eslint --ext .ts,.js,.vue --ignore-path .gitignore .",
"lint-fix": "eslint --fix --ext .ts,.js,.vue --ignore-path .gitignore .",
"lint-soft-fix": "eslint --fix-dry-run --ext .ts,.js,.vue --ignore-path .gitignore .",
"start": "nuxt-start",
"generate": "nuxt-ts generate",
"post-update": "yarn upgrade --latest"
},
"eslintConfig": ".eslintrc",
"dependencies": {
"@babel/core": "^7.14.3",
"@babel/eslint-parser": "^7.14.3",
"@babel/plugin-proposal-class-properties": "^7.13.0",
"@babel/plugin-proposal-decorators": "^7.14.2",
"@nuxt/babel-preset-app": "2.15.6",
"@nuxt/types": "^2.15.0",
"@nuxt/typescript-build": "^2.1.0",
"@nuxt/typescript-runtime": "^2.1.0",
"@nuxtjs/eslint-config-typescript": "^6.0.0",
"@nuxtjs/eslint-module": "3.0.2",
"@nuxtjs/tailwindcss": "^3.4.0",
"@typescript-eslint/eslint-plugin": "4.24.0",
"@typescript-eslint/parser": "4.24.0",
"autoprefixer": "^9.0.0",
"eslint": "^7.27.0",
"eslint-config-prettier": "^8.3.0",
"eslint-loader": "^4.0.2",
"eslint-plugin-prettier": "^3.4.0",
"eslint-plugin-vue": "^7.9.0",
"nuxt": "^2.15.0",
"nuxt-mq": "^2.0.2",
"nuxt-property-decorator": "^2.9.1",
"nuxt-start": "^2.15.6",
"postcss": "^7.0.35",
"prettier": "^2.3.0",
"vue-class-component": "^7.2.0",
"vue-property-decorator": "^9.1.0"
},
"devDependencies": {},
"keywords": [
"vue",
"nuxt",
"typescript"
]
}
// .babelrc
{
"presets": [],
"plugins": [
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
],
[
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
]
]
}