Mostly set up
This commit is contained in:
The Jared Wilcurt
parent
2cf9a5b16f
commit
620b4f3ddb
2
.browserslistrc
Normal file
2
.browserslistrc
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
> 1%
|
||||||
|
last 2 versions
|
||||||
25
.editorconfig
Normal file
25
.editorconfig
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
# EditorConfig is awesome: http://EditorConfig.org
|
||||||
|
|
||||||
|
# Top-most EditorConfig file
|
||||||
|
root = true
|
||||||
|
|
||||||
|
# defaults for all files
|
||||||
|
[*]
|
||||||
|
charset = utf-8
|
||||||
|
end_of_line = lf
|
||||||
|
indent_size = 2
|
||||||
|
indent_style = space
|
||||||
|
insert_final_newline = true
|
||||||
|
trim_trailing_whitespace = true
|
||||||
|
|
||||||
|
# Markdown files uses two trailing spaces to indicate a <br>
|
||||||
|
[*.{md}]
|
||||||
|
trim_trailing_whitespace = false
|
||||||
|
|
||||||
|
# 4 space indentation
|
||||||
|
[*.{sass,scss,css}]
|
||||||
|
indent_size = 4
|
||||||
|
|
||||||
|
# 2 space indentation
|
||||||
|
[*.{html,json}]
|
||||||
|
indent_size = 2
|
||||||
188
.eslintrc.js
Normal file
188
.eslintrc.js
Normal file
@ -0,0 +1,188 @@
|
|||||||
|
module.exports = {
|
||||||
|
root: true,
|
||||||
|
parserOptions: {
|
||||||
|
parser: 'babel-eslint',
|
||||||
|
ecmaVersion: 8,
|
||||||
|
sourceType: 'module'
|
||||||
|
},
|
||||||
|
env: {
|
||||||
|
browser: true,
|
||||||
|
node: true
|
||||||
|
},
|
||||||
|
globals: {
|
||||||
|
jsdom: true,
|
||||||
|
Promise: true,
|
||||||
|
nw: true,
|
||||||
|
Vue: true,
|
||||||
|
Vuex: true,
|
||||||
|
VueRouter: true,
|
||||||
|
httpVueLoader: true,
|
||||||
|
store: true,
|
||||||
|
router: true
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
'jest',
|
||||||
|
// required to lint *.vue files
|
||||||
|
'vue'
|
||||||
|
],
|
||||||
|
extends: [
|
||||||
|
'eslint:recommended',
|
||||||
|
'plugin:vue/recommended',
|
||||||
|
'plugin:jest/recommended'
|
||||||
|
],
|
||||||
|
rules: {
|
||||||
|
'arrow-parens': ['off'],
|
||||||
|
'brace-style': [
|
||||||
|
'error',
|
||||||
|
'1tbs',
|
||||||
|
{
|
||||||
|
'allowSingleLine': true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'comma-dangle': ['error', 'never'],
|
||||||
|
'comma-spacing': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'before': false,
|
||||||
|
'after': true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'comma-style': ['error', 'last'],
|
||||||
|
'curly': ['error'],
|
||||||
|
// allow async-await
|
||||||
|
'generator-star-spacing': ['off'],
|
||||||
|
// 2 space indentation to match .editorconfig
|
||||||
|
'indent': [
|
||||||
|
'error',
|
||||||
|
2,
|
||||||
|
{
|
||||||
|
'SwitchCase': 1
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'keyword-spacing': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'before': true,
|
||||||
|
'after': true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// allow debugger during development
|
||||||
|
'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||||
|
'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
|
||||||
|
'no-multi-spaces': ['error'],
|
||||||
|
'no-restricted-syntax': ['error', 'Property[method="true"]'],
|
||||||
|
'no-unused-vars': ['error'],
|
||||||
|
'no-undef': ['error'],
|
||||||
|
// Only allow let and const, no var
|
||||||
|
'no-var': ['error'],
|
||||||
|
'object-curly-spacing': ['error', 'always'],
|
||||||
|
'one-var': ['error', 'never'],
|
||||||
|
'quotes': ['error', 'single'],
|
||||||
|
'semi': ['error', 'always'],
|
||||||
|
'space-before-blocks': ['error', 'always'],
|
||||||
|
'space-before-function-paren': ['error', 'always'],
|
||||||
|
'space-in-parens': ['error', 'never'],
|
||||||
|
'space-infix-ops': ['error'],
|
||||||
|
'spaced-comment': ['error', 'always'],
|
||||||
|
// Vue Linter Options
|
||||||
|
'vue/attribute-hyphenation': ['error', 'never'],
|
||||||
|
'vue/attributes-order': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'order': [
|
||||||
|
// 'v-for item in items'
|
||||||
|
'LIST_RENDERING',
|
||||||
|
// 'v-if', 'v-else-if', 'v-else', 'v-show', 'v-cloak'
|
||||||
|
'CONDITIONALS',
|
||||||
|
// 'v-once', 'v-pre'
|
||||||
|
'RENDER_MODIFIERS',
|
||||||
|
// 'v-model', 'v-bind', ':property="foo"'
|
||||||
|
'BINDING',
|
||||||
|
// 'v-text', 'v-html'
|
||||||
|
'CONTENT',
|
||||||
|
// 'is'
|
||||||
|
'DEFINITION',
|
||||||
|
// 'id'
|
||||||
|
'GLOBAL',
|
||||||
|
// 'customProp="foo"', 'class', 'type', 'value' etc
|
||||||
|
'OTHER_ATTR',
|
||||||
|
// '@click="functionCall"', 'v-on="event"'
|
||||||
|
'EVENTS',
|
||||||
|
// 'slot', 'key', 'ref'
|
||||||
|
'UNIQUE'
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/html-closing-bracket-newline': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'singleline': 'never',
|
||||||
|
'multiline': 'always'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/html-closing-bracket-spacing': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'startTag': 'never',
|
||||||
|
'endTag': 'never',
|
||||||
|
'selfClosingTag': 'always'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/html-indent': [
|
||||||
|
'error',
|
||||||
|
2,
|
||||||
|
{
|
||||||
|
'attribute': 1,
|
||||||
|
'closeBracket': 0
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/html-self-closing': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'html': {
|
||||||
|
'void': 'always',
|
||||||
|
'normal': 'never',
|
||||||
|
'component': 'always'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/max-attributes-per-line': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'singleline': 3,
|
||||||
|
'multiline': {
|
||||||
|
'max': 1,
|
||||||
|
'allowFirstLine': false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/name-property-casing': ['error', 'PascalCase'],
|
||||||
|
'vue/order-in-components': [
|
||||||
|
'error',
|
||||||
|
{
|
||||||
|
'order': [
|
||||||
|
'el',
|
||||||
|
'name',
|
||||||
|
['template', 'render'],
|
||||||
|
'parent',
|
||||||
|
'functional',
|
||||||
|
['delimiters', 'comments'],
|
||||||
|
['components', 'directives'],
|
||||||
|
'extends',
|
||||||
|
'mixins',
|
||||||
|
'inheritAttrs',
|
||||||
|
'model',
|
||||||
|
['props', 'propsData'],
|
||||||
|
'data',
|
||||||
|
'methods',
|
||||||
|
'computed',
|
||||||
|
'filters',
|
||||||
|
'watch',
|
||||||
|
'LIFECYCLE_HOOKS',
|
||||||
|
'renderError'
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
'vue/prop-name-casing': ['error', 'camelCase']
|
||||||
|
}
|
||||||
|
};
|
||||||
80
.gitignore
vendored
80
.gitignore
vendored
@ -1,61 +1,27 @@
|
|||||||
# Logs
|
.DS_Store
|
||||||
logs
|
node_modules
|
||||||
*.log
|
/dist/
|
||||||
|
/dist-vue/
|
||||||
|
|
||||||
|
/tests/e2e/videos/
|
||||||
|
/tests/e2e/screenshots/
|
||||||
|
/tests/e2e/reports/
|
||||||
|
selenium-debug.log
|
||||||
|
|
||||||
|
# local env files
|
||||||
|
.env.local
|
||||||
|
.env.*.local
|
||||||
|
|
||||||
|
# Log files
|
||||||
npm-debug.log*
|
npm-debug.log*
|
||||||
yarn-debug.log*
|
yarn-debug.log*
|
||||||
yarn-error.log*
|
yarn-error.log*
|
||||||
|
|
||||||
# Runtime data
|
# Editor directories and files
|
||||||
pids
|
.idea
|
||||||
*.pid
|
.vscode
|
||||||
*.seed
|
*.suo
|
||||||
*.pid.lock
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
*.sln
|
||||||
lib-cov
|
*.sw?
|
||||||
|
|
||||||
# Coverage directory used by tools like istanbul
|
|
||||||
coverage
|
|
||||||
|
|
||||||
# nyc test coverage
|
|
||||||
.nyc_output
|
|
||||||
|
|
||||||
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
|
||||||
.grunt
|
|
||||||
|
|
||||||
# Bower dependency directory (https://bower.io/)
|
|
||||||
bower_components
|
|
||||||
|
|
||||||
# node-waf configuration
|
|
||||||
.lock-wscript
|
|
||||||
|
|
||||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
|
||||||
build/Release
|
|
||||||
|
|
||||||
# Dependency directories
|
|
||||||
node_modules/
|
|
||||||
jspm_packages/
|
|
||||||
|
|
||||||
# TypeScript v1 declaration files
|
|
||||||
typings/
|
|
||||||
|
|
||||||
# Optional npm cache directory
|
|
||||||
.npm
|
|
||||||
|
|
||||||
# Optional eslint cache
|
|
||||||
.eslintcache
|
|
||||||
|
|
||||||
# Optional REPL history
|
|
||||||
.node_repl_history
|
|
||||||
|
|
||||||
# Output of 'npm pack'
|
|
||||||
*.tgz
|
|
||||||
|
|
||||||
# Yarn Integrity file
|
|
||||||
.yarn-integrity
|
|
||||||
|
|
||||||
# dotenv environment variables file
|
|
||||||
.env
|
|
||||||
|
|
||||||
# next.js build output
|
|
||||||
.next
|
|
||||||
|
|||||||
43
README.md
43
README.md
@ -1,2 +1,45 @@
|
|||||||
# nw-vue-cli-example
|
# nw-vue-cli-example
|
||||||
|
|
||||||
NW.js + Vue-CLI 3 example
|
NW.js + Vue-CLI 3 example
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
* Vue
|
||||||
|
* Vue-DevTools
|
||||||
|
* Babel
|
||||||
|
* ESLint
|
||||||
|
* Jest
|
||||||
|
* Nightwatch (not working)
|
||||||
|
|
||||||
|
|
||||||
|
## Running Locally for development
|
||||||
|
|
||||||
|
1. `npm install`
|
||||||
|
1. `npm start`
|
||||||
|
1. An empty window will pop up while Webpack warm ups
|
||||||
|
1. Once Webpack is running, refresh the window and you're golden
|
||||||
|
|
||||||
|
|
||||||
|
## Building for distribution
|
||||||
|
|
||||||
|
1. `npm run build:clean` will delete your `./dist` and `./dist-vue` folders
|
||||||
|
1. `npm run build:vue` will build just your Vue app for distribution (`./dist-vue`)
|
||||||
|
1. `npm run build:nw` will build just your NW.js app (`./dist`)
|
||||||
|
1. `npm run build` is your all-in-one command. It will clean out the old dist folders and build your Vue and NW.js app
|
||||||
|
|
||||||
|
|
||||||
|
# **IMPORTANT NOTE ABOUT BUILDS!!!**
|
||||||
|
|
||||||
|
They take a long time. If you do `npm run build` expect it to take 10-15 minutes. This can be adjusted by changing the build params in the `package.json`. The more platforms and build types, the longer it takes.
|
||||||
|
|
||||||
|
|
||||||
|
## Automated quality enforcment
|
||||||
|
|
||||||
|
1. **Linting:** `npm run lint` - Uses rules in `./eslint.json`
|
||||||
|
1. **Unit tests:** `npm run test:unit` - [Jest](https://jestjs.io).
|
||||||
|
1. **End-to-end:** `npm run test:e2e` - Accepting PR to make tests run in NW.js. - [Nightwatch](https://nightwatchjs.org).
|
||||||
|
|
||||||
|
|
||||||
|
### Customize configuration
|
||||||
|
|
||||||
|
See [Vue-CLI documentation](https://cli.vuejs.org/config).
|
||||||
|
|||||||
5
babel.config.js
Normal file
5
babel.config.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
module.exports = {
|
||||||
|
presets: [
|
||||||
|
'@vue/app'
|
||||||
|
]
|
||||||
|
};
|
||||||
30
jest.config.js
Normal file
30
jest.config.js
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
module.exports = {
|
||||||
|
moduleFileExtensions: [
|
||||||
|
'js',
|
||||||
|
'jsx',
|
||||||
|
'json',
|
||||||
|
'vue'
|
||||||
|
],
|
||||||
|
transform: {
|
||||||
|
'^.+\\.vue$': 'vue-jest',
|
||||||
|
'.+\\.(css|styl|less|sass|scss|svg|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub',
|
||||||
|
'^.+\\.jsx?$': 'babel-jest'
|
||||||
|
},
|
||||||
|
transformIgnorePatterns: [
|
||||||
|
'/node_modules/'
|
||||||
|
],
|
||||||
|
moduleNameMapper: {
|
||||||
|
'^@/(.*)$': '<rootDir>/src/$1'
|
||||||
|
},
|
||||||
|
snapshotSerializers: [
|
||||||
|
'jest-serializer-vue'
|
||||||
|
],
|
||||||
|
testMatch: [
|
||||||
|
'**/tests/unit/**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)'
|
||||||
|
],
|
||||||
|
testURL: 'http://localhost/',
|
||||||
|
watchPlugins: [
|
||||||
|
'jest-watch-typeahead/filename',
|
||||||
|
'jest-watch-typeahead/testname'
|
||||||
|
]
|
||||||
|
};
|
||||||
21
nightwatch.conf.js
Normal file
21
nightwatch.conf.js
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
// eslint-disable-next-line no-unused-vars
|
||||||
|
let nwBinary = 'nwjs/nw.exe';
|
||||||
|
let driver = 'nwjs/chromedriver.exe';
|
||||||
|
|
||||||
|
if (process.platform === 'linux') {
|
||||||
|
nwBinary = 'nwjs/nw';
|
||||||
|
driver = 'nwjs/chromedriver';
|
||||||
|
}
|
||||||
|
if (process.platform === 'darwin') {
|
||||||
|
nwBinary = 'nwjs.app/contents/MacOS/nwjs';
|
||||||
|
driver = 'chromedriver';
|
||||||
|
}
|
||||||
|
|
||||||
|
nwBinary = './node_modules/nw/' + nwBinary;
|
||||||
|
driver = './node_modules/nw/' + driver;
|
||||||
|
|
||||||
|
module.exports = (function (settings) {
|
||||||
|
settings.webdriver.server_path = driver;
|
||||||
|
settings.selenium.cli_args['webdriver.chrome.driver'] = driver;
|
||||||
|
return settings;
|
||||||
|
})(require('./nightwatch.json'));
|
||||||
2
nightwatch.json
Normal file
2
nightwatch.json
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
{
|
||||||
|
}
|
||||||
16552
package-lock.json
generated
Normal file
16552
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
113
package.json
Normal file
113
package.json
Normal file
@ -0,0 +1,113 @@
|
|||||||
|
{
|
||||||
|
"name": "nw-vue",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"main": "http://localhost:8964",
|
||||||
|
"node-remote": "http://localhost:8964",
|
||||||
|
"node-main": "",
|
||||||
|
"window": {
|
||||||
|
"width": 960,
|
||||||
|
"height": 600,
|
||||||
|
"min_width": 700,
|
||||||
|
"min_height": 500,
|
||||||
|
"icon": "src/assets/vue.png"
|
||||||
|
},
|
||||||
|
"private": true,
|
||||||
|
"scripts": {
|
||||||
|
"start": "concurrently \"npm run serve\" \"nw .\"",
|
||||||
|
"serve": "vue-cli-service serve --port=8964",
|
||||||
|
"build": "npm run build:clean && npm run build:vue && npm run build:nw",
|
||||||
|
"build:clean": "rimraf ./dist-vue ./dist",
|
||||||
|
"build:vue": "vue-cli-service build --modern --dest ./dist-vue",
|
||||||
|
"build:nw": "build --concurrent --tasks win-x86 --mirror https://dl.nwjs.io/ .",
|
||||||
|
"build:nw2": "build --concurrent --tasks win-x86,linux-x86,linux-x64,mac-x64 --mirror https://dl.nwjs.io/ .",
|
||||||
|
"run:win": "dist\\nw-vue-1.0.0-win-x86\\nw-vue.exe",
|
||||||
|
"lint": "vue-cli-service lint --no-fix",
|
||||||
|
"fix": "vue-cli-service lint --fix",
|
||||||
|
"test:e2e": "vue-cli-service test:e2e",
|
||||||
|
"test:unit": "vue-cli-service test:unit"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"express": "^4.17.1"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@vue/cli-plugin-babel": "^3.9.0",
|
||||||
|
"@vue/cli-plugin-e2e-nightwatch": "^3.9.0",
|
||||||
|
"@vue/cli-plugin-eslint": "^3.9.0",
|
||||||
|
"@vue/cli-plugin-unit-jest": "^3.9.0",
|
||||||
|
"@vue/cli-service": "^3.9.0",
|
||||||
|
"@vue/test-utils": "1.0.0-beta.29",
|
||||||
|
"babel-core": "7.0.0-bridge.0",
|
||||||
|
"babel-eslint": "^10.0.1",
|
||||||
|
"babel-jest": "^23.6.0",
|
||||||
|
"concurrently": "^4.1.1",
|
||||||
|
"core-js": "^2.6.5",
|
||||||
|
"eslint": "^5.16.0",
|
||||||
|
"eslint-plugin-jest": "^22.7.2",
|
||||||
|
"eslint-plugin-vue": "^5.0.0",
|
||||||
|
"nw": "0.39.2-sdk",
|
||||||
|
"nw-vue-devtools": "^1.3.0",
|
||||||
|
"nwjs-builder-phoenix": "^1.15.0",
|
||||||
|
"nwjs-types": "^1.0.0",
|
||||||
|
"rimraf": "^2.6.3",
|
||||||
|
"vue": "^2.6.10",
|
||||||
|
"vue-template-compiler": "^2.6.10"
|
||||||
|
},
|
||||||
|
"chromium-args": "--load-extension='./node_modules/nw-vue-devtools/extension'",
|
||||||
|
"build": {
|
||||||
|
"nwVersion": "v0.39.2",
|
||||||
|
"nwFlavor": "normal",
|
||||||
|
"targets": [
|
||||||
|
"zip",
|
||||||
|
"nsis7z"
|
||||||
|
],
|
||||||
|
"files": [
|
||||||
|
"**/*"
|
||||||
|
],
|
||||||
|
"excludes": [
|
||||||
|
"e2e/**/*",
|
||||||
|
"src/**/*",
|
||||||
|
"tests/**/*",
|
||||||
|
"public/**/*"
|
||||||
|
".browserslistrc",
|
||||||
|
".eslintrc",
|
||||||
|
".gitignore",
|
||||||
|
".editorconfig",
|
||||||
|
"babel.config.js",
|
||||||
|
"cypress.json",
|
||||||
|
"jest.config.js",
|
||||||
|
"nightwatch.conf.js",
|
||||||
|
"nightwatch.json",
|
||||||
|
"package-lock.json",
|
||||||
|
"screenshot.png",
|
||||||
|
"selenium-debug.log",
|
||||||
|
"postcss.config.js",
|
||||||
|
"vue.config.js"
|
||||||
|
],
|
||||||
|
"strippedProperties": [
|
||||||
|
"chromium-args",
|
||||||
|
"scripts",
|
||||||
|
"devDependencies",
|
||||||
|
"build"
|
||||||
|
],
|
||||||
|
"overriddenProperties": {
|
||||||
|
"main": "http://localhost:8965",
|
||||||
|
"node-remote": "http://localhost:8965",
|
||||||
|
"node-main": "server.js"
|
||||||
|
},
|
||||||
|
"win": {
|
||||||
|
"icon": "public/icon.ico"
|
||||||
|
},
|
||||||
|
"mac": {
|
||||||
|
"icon": "public/icon.icns"
|
||||||
|
},
|
||||||
|
"nsis": {
|
||||||
|
"icon": "public/icon.ico",
|
||||||
|
"unIcon": "public/icon.ico",
|
||||||
|
"languages": [
|
||||||
|
"English"
|
||||||
|
],
|
||||||
|
"diffUpdaters": false,
|
||||||
|
"hashCalculation": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
5
postcss.config.js
Normal file
5
postcss.config.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
module.exports = {
|
||||||
|
plugins: {
|
||||||
|
autoprefixer: {}
|
||||||
|
}
|
||||||
|
};
|
||||||
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
BIN
public/icon.icns
Normal file
BIN
public/icon.icns
Normal file
Binary file not shown.
BIN
public/icon.ico
Normal file
BIN
public/icon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
BIN
public/icon.png
Normal file
BIN
public/icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
14
public/index.html
Normal file
14
public/index.html
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
|
<title>NwVue</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"></div>
|
||||||
|
<!-- built files will be auto injected -->
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
screenshot.png
Normal file
BIN
screenshot.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
4
server.js
Normal file
4
server.js
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
const express = require('express');
|
||||||
|
const app = express();
|
||||||
|
app.use(express.static('./dist-vue'));
|
||||||
|
app.listen(8965);
|
||||||
41
src/App.vue
Normal file
41
src/App.vue
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
<template>
|
||||||
|
<div id="app">
|
||||||
|
<img
|
||||||
|
src="@/assets/vue.png"
|
||||||
|
alt="Vue.js logo"
|
||||||
|
title="Vue.js"
|
||||||
|
class="logo"
|
||||||
|
/>
|
||||||
|
<img
|
||||||
|
src="@/assets/nw.png"
|
||||||
|
alt="NW.js logo"
|
||||||
|
title="NW.js"
|
||||||
|
class="logo"
|
||||||
|
/>
|
||||||
|
<HelloWorld msg="Welcome to your Vue.js Desktop App in NW.js!" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import HelloWorld from '@/components/HelloWorld.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'App',
|
||||||
|
components: {
|
||||||
|
HelloWorld
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#app {
|
||||||
|
margin-top: 60px;
|
||||||
|
color: #2C3E50;
|
||||||
|
font-family: 'Avenir', sans-serif;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
max-height: 140px;
|
||||||
|
margin: 0px 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
BIN
src/assets/nw.png
Normal file
BIN
src/assets/nw.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 104 KiB |
BIN
src/assets/vue.png
Normal file
BIN
src/assets/vue.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.7 KiB |
183
src/components/HelloWorld.vue
Normal file
183
src/components/HelloWorld.vue
Normal file
@ -0,0 +1,183 @@
|
|||||||
|
<template>
|
||||||
|
<div class="hello">
|
||||||
|
<h1>{{ msg }}</h1>
|
||||||
|
<h3 data-test="versions">
|
||||||
|
You are using
|
||||||
|
Vue.js (v{{ vueVersion }}),
|
||||||
|
NW.js (v{{ versions.nw }}-{{ versions['nw-flavor'] }}),
|
||||||
|
Node.js (v{{ versions.node }}),
|
||||||
|
and
|
||||||
|
Chromium (v{{ versions.chromium }}).
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<button v-if="devMode" @click="toggleDevTools">
|
||||||
|
<template v-if="showDevTools">
|
||||||
|
Show
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
Hide
|
||||||
|
</template>
|
||||||
|
Developer Tools
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<p>You can use the resources below to find more information around building your Vue App.</p>
|
||||||
|
<LinkList :links="welcomeLinks" />
|
||||||
|
|
||||||
|
<h3>Installed CLI Plugins</h3>
|
||||||
|
<LinkList :links="pluginLinks" />
|
||||||
|
|
||||||
|
<h3>Essential Links</h3>
|
||||||
|
<LinkList :links="essentialLinks" />
|
||||||
|
|
||||||
|
<h3>Ecosystem</h3>
|
||||||
|
<LinkList :links="ecosystemLinks" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Vue from 'vue';
|
||||||
|
|
||||||
|
import LinkList from '@/components/LinkList.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'HelloWorld',
|
||||||
|
components: {
|
||||||
|
LinkList
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
msg: {
|
||||||
|
type: String,
|
||||||
|
default: 'Welcome to your Vue Desktop App in NW.js!'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data: function () {
|
||||||
|
return {
|
||||||
|
showDevTools: true,
|
||||||
|
welcomeLinks: [
|
||||||
|
{
|
||||||
|
name: 'nw-vue-cli-example',
|
||||||
|
url: 'https://github.com/nwutils/nw-vue-cli-example'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'NW.js',
|
||||||
|
url: 'https://nwjs.io'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'nw-vue-devtools',
|
||||||
|
url: 'https://github.com/nwutils/nw-vue-devtools'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'nwjs-builder-phoenix',
|
||||||
|
url: 'https://github.com/evshiron/nwjs-builder-phoenix'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'vue-cli',
|
||||||
|
url: 'https://cli.vuejs.org'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
pluginLinks: [
|
||||||
|
{
|
||||||
|
name: 'babel',
|
||||||
|
url: 'https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'eslint',
|
||||||
|
url: 'https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'unit-jest',
|
||||||
|
url: 'https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-unit-jest'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'e2e-cypress',
|
||||||
|
url: 'https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-e2e-cypress'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
essentialLinks: [
|
||||||
|
{
|
||||||
|
name: 'Core Docs',
|
||||||
|
url: 'https://vuejs.org'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Forum',
|
||||||
|
url: 'https://forum.vuejs.org'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Community Chat',
|
||||||
|
url: 'https://chat.vuejs.org'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Twitter',
|
||||||
|
url: 'https://twitter.com/vuejs'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'News',
|
||||||
|
url: 'https://news.vuejs.org'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
ecosystemLinks: [
|
||||||
|
{
|
||||||
|
name: 'vue-router',
|
||||||
|
url: 'https://router.vuejs.org'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'vuex',
|
||||||
|
url: 'https://vuex.vuejs.org'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'vue-devtools',
|
||||||
|
url: 'https://github.com/vuejs/vue-devtools#vue-devtools'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'vue-loader',
|
||||||
|
url: 'https://vue-loader.vuejs.org'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'awesome-vue',
|
||||||
|
url: 'https://github.com/vuejs/awesome-vue'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
toggleDevTools: function () {
|
||||||
|
if (this.showDevTools) {
|
||||||
|
nw.Window.get().showDevTools();
|
||||||
|
} else {
|
||||||
|
nw.Window.get().closeDevTools();
|
||||||
|
}
|
||||||
|
this.showDevTools = !this.showDevTools;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
devMode: function () {
|
||||||
|
return process.env.NODE_ENV === 'development';
|
||||||
|
},
|
||||||
|
versions: function () {
|
||||||
|
return window.process.versions;
|
||||||
|
},
|
||||||
|
vueVersion: function () {
|
||||||
|
return Vue.version;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
<style scoped>
|
||||||
|
h3 {
|
||||||
|
margin: 40px 0px 0px;
|
||||||
|
}
|
||||||
|
button {
|
||||||
|
background: linear-gradient(0deg, #2EB277, #65E6AC);
|
||||||
|
border-width: 3.4px;
|
||||||
|
border-color: #35495E;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: 22px 0px 6px 0px;
|
||||||
|
padding: 11px 17px;
|
||||||
|
color: #050709;
|
||||||
|
font-family: 'Trebuchet MS', Verdana, sans-serif;
|
||||||
|
font-size: 19px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
64
src/components/LinkList.vue
Normal file
64
src/components/LinkList.vue
Normal file
@ -0,0 +1,64 @@
|
|||||||
|
<template>
|
||||||
|
<ul v-if="links">
|
||||||
|
<li
|
||||||
|
v-for="(link, linkIndex) in links"
|
||||||
|
:title="link.url.replace('https://', '')"
|
||||||
|
:key="'eco' + linkIndex"
|
||||||
|
>
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
@click.prevent="open(link.url)"
|
||||||
|
>
|
||||||
|
{{ link.name }}
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'LinkList',
|
||||||
|
props: {
|
||||||
|
links: {
|
||||||
|
type: Array,
|
||||||
|
required: false,
|
||||||
|
default: null,
|
||||||
|
validator: function (links) {
|
||||||
|
let valid = true;
|
||||||
|
links.forEach(function (link) {
|
||||||
|
if (
|
||||||
|
!link.name ||
|
||||||
|
!link.url ||
|
||||||
|
!link.name.length ||
|
||||||
|
!link.url.length ||
|
||||||
|
typeof(link.name) !== 'string' ||
|
||||||
|
typeof(link.url) !== 'string'
|
||||||
|
) {
|
||||||
|
valid = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
return valid;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
open: function (url) {
|
||||||
|
nw.Shell.openExternal(url);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
ul {
|
||||||
|
padding: 0px;
|
||||||
|
list-style-type: none;
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
display: inline-block;
|
||||||
|
margin: 0px 10px;
|
||||||
|
}
|
||||||
|
a {
|
||||||
|
color: #42B983;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
11
src/main.js
Normal file
11
src/main.js
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import Vue from 'vue';
|
||||||
|
import App from './App.vue';
|
||||||
|
|
||||||
|
Vue.config.productionTip = false;
|
||||||
|
|
||||||
|
// eslint-ignore-next-line no-unused-vars
|
||||||
|
const app = new Vue({
|
||||||
|
render: function (hyperscript) {
|
||||||
|
return hyperscript(App);
|
||||||
|
}
|
||||||
|
}).$mount('#app');
|
||||||
25
tests/e2e/custom-assertions/elementCount.js
Normal file
25
tests/e2e/custom-assertions/elementCount.js
Normal file
@ -0,0 +1,25 @@
|
|||||||
|
// A custom Nightwatch assertion.
|
||||||
|
// The assertion name is the filename.
|
||||||
|
// Example usage:
|
||||||
|
//
|
||||||
|
// browser.assert.elementCount(selector, count)
|
||||||
|
//
|
||||||
|
// For more information on custom assertions see:
|
||||||
|
// http://nightwatchjs.org/guide#writing-custom-assertions
|
||||||
|
|
||||||
|
exports.assertion = function elementCount (selector, count) {
|
||||||
|
this.message = 'Testing if element "' + selector + '" has count: ' + count;
|
||||||
|
this.expected = count;
|
||||||
|
this.pass = (value) => {
|
||||||
|
return value === count;
|
||||||
|
};
|
||||||
|
this.value = (result) => {
|
||||||
|
return result.value;
|
||||||
|
};
|
||||||
|
function evaluator (_selector) {
|
||||||
|
return document.querySelectorAll(_selector).length;
|
||||||
|
}
|
||||||
|
this.command = (cb) => {
|
||||||
|
return this.api.execute(evaluator, [selector], cb);
|
||||||
|
};
|
||||||
|
};
|
||||||
15
tests/e2e/specs/test.js
Normal file
15
tests/e2e/specs/test.js
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
// For authoring Nightwatch tests, see
|
||||||
|
// http://nightwatchjs.org/guide#usage
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
'default e2e tests': (browser) => {
|
||||||
|
browser
|
||||||
|
.url(process.env.VUE_DEV_SERVER_URL)
|
||||||
|
.waitForElementVisible('#app', 5000)
|
||||||
|
.assert.elementPresent('.hello')
|
||||||
|
.assert.containsText('h1', 'Welcome to your Vue.js Desktop App in NW.js!')
|
||||||
|
.assert.containsText('[data-test="versions]"', 'You are using Vue.js (v2.6.10), NW.js (v0.39.2-sdk), Node.js (v12.4.0), and Chromium (v75.0.3770.100).')
|
||||||
|
.assert.elementCount('img', 2)
|
||||||
|
.end();
|
||||||
|
}
|
||||||
|
};
|
||||||
5
tests/unit/.eslintrc.js
Normal file
5
tests/unit/.eslintrc.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
module.exports = {
|
||||||
|
env: {
|
||||||
|
jest: true
|
||||||
|
}
|
||||||
|
};
|
||||||
12
tests/unit/example.spec.js
Normal file
12
tests/unit/example.spec.js
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
import { shallowMount } from '@vue/test-utils';
|
||||||
|
import HelloWorld from '@/components/HelloWorld.vue';
|
||||||
|
|
||||||
|
describe('HelloWorld.vue', () => {
|
||||||
|
it('renders props.msg when passed', () => {
|
||||||
|
const msg = 'new message';
|
||||||
|
const wrapper = shallowMount(HelloWorld, {
|
||||||
|
propsData: { msg }
|
||||||
|
});
|
||||||
|
expect(wrapper.text()).toMatch(msg);
|
||||||
|
});
|
||||||
|
});
|
||||||
3
vue.config.js
Normal file
3
vue.config.js
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
module.exports = {
|
||||||
|
lintOnSave: false
|
||||||
|
};
|
||||||
Loading…
Reference in New Issue
Block a user