\n ),\n threshold: 10240,\n minRatio: 0.8\n })\n )\n}\n\nif (config.build.bundleAnalyzerReport) {\n const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin\n webpackConfig.plugins.push(new BundleAnalyzerPlugin())\n}\n\nmodule.exports = webpackConfig\n","id":"8ebf377a-6897-403c-b746-2b586bc6f128","is_binary":false,"title":"webpack.prod.conf.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"SkHeCawgFWN","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"'use strict'\nconst utils = require('.\u002Futils')\nconst webpack = require('webpack')\nconst config = require('..\u002Fconfig')\nconst merge = require('webpack-merge')\nconst path = require('path')\nconst baseWebpackConfig = require('.\u002Fwebpack.base.conf')\nconst CopyWebpackPlugin = require('copy-webpack-plugin')\nconst HtmlWebpackPlugin = require('html-webpack-plugin')\nconst FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')\nconst portfinder = require('portfinder')\n\nconst HOST = process.env.HOST\nconst PORT = process.env.PORT && Number(process.env.PORT)\n\nconst devWebpackConfig = merge(baseWebpackConfig, {\n module: {\n rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })\n },\n \u002F\u002F cheap-module-eval-source-map is faster for development\n devtool: config.dev.devtool,\n\n \u002F\u002F these devServer options should be customized in \u002Fconfig\u002Findex.js\n devServer: {\n clientLogLevel: 'warning',\n historyApiFallback: {\n rewrites: [\n { from: \u002F.*\u002F, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },\n ],\n },\n hot: true,\n contentBase: false, \u002F\u002F since we use CopyWebpackPlugin.\n compress: true,\n host: HOST || config.dev.host,\n port: PORT || config.dev.port,\n open: config.dev.autoOpenBrowser,\n overlay: config.dev.errorOverlay\n ? { warnings: false, errors: true }\n : false,\n publicPath: config.dev.assetsPublicPath,\n proxy: config.dev.proxyTable,\n quiet: true, \u002F\u002F necessary for FriendlyErrorsPlugin\n watchOptions: {\n poll: config.dev.poll,\n }\n },\n plugins: [\n new webpack.DefinePlugin({\n 'process.env': require('..\u002Fconfig\u002Fdev.env')\n }),\n new webpack.HotModuleReplacementPlugin(),\n new webpack.NamedModulesPlugin(), \u002F\u002F HMR shows correct file names in console on update.\n new webpack.NoEmitOnErrorsPlugin(),\n \u002F\u002F https:\u002F\u002Fgithub.com\u002Fampedandwired\u002Fhtml-webpack-plugin\n new HtmlWebpackPlugin({\n filename: 'index.html',\n template: 'index.html',\n inject: true\n }),\n \u002F\u002F copy custom static assets\n new CopyWebpackPlugin([\n {\n from: path.resolve(__dirname, '..\u002Fstatic'),\n to: config.dev.assetsSubDirectory,\n ignore: ['.*']\n }\n ])\n ]\n})\n\nmodule.exports = new Promise((resolve, reject) =\u003E {\n portfinder.basePort = process.env.PORT || config.dev.port\n portfinder.getPort((err, port) =\u003E {\n if (err) {\n reject(err)\n } else {\n \u002F\u002F publish the new Port, necessary for e2e tests\n process.env.PORT = port\n \u002F\u002F add port to devServer config\n devWebpackConfig.devServer.port = port\n\n \u002F\u002F Add FriendlyErrorsPlugin\n devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({\n compilationSuccessInfo: {\n messages: [`Your application is running here: http:\u002F\u002F${devWebpackConfig.devServer.host}:${port}`],\n },\n onErrors: config.dev.notifyOnErrors\n ? utils.createNotifierCallback()\n : undefined\n }))\n\n resolve(devWebpackConfig)\n }\n })\n})\n","id":"90564124-0d8d-4666-b178-2e3cab15f453","is_binary":false,"title":"webpack.dev.conf.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"SJNgRpvxKZ4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"'use strict'\nconst path = require('path')\nconst utils = require('.\u002Futils')\nconst config = require('..\u002Fconfig')\nconst vueLoaderConfig = require('.\u002Fvue-loader.conf')\n\nfunction resolve (dir) {\n return path.join(__dirname, '..', dir)\n}\n\nconst createLintingRule = () =\u003E ({\n test: \u002F\\.(js|vue)$\u002F,\n loader: 'eslint-loader',\n enforce: 'pre',\n include: [resolve('src'), resolve('test')],\n options: {\n formatter: require('eslint-friendly-formatter'),\n emitWarning: !config.dev.showEslintErrorsInOverlay\n }\n})\n\nmodule.exports = {\n context: path.resolve(__dirname, '..\u002F'),\n entry: {\n app: '.\u002Fsrc\u002Fmain.js'\n },\n output: {\n path: config.build.assetsRoot,\n filename: '[name].js',\n publicPath: process.env.NODE_ENV === 'production'\n ? config.build.assetsPublicPath\n : config.dev.assetsPublicPath\n },\n resolve: {\n extensions: ['.js', '.vue', '.json'],\n alias: {\n 'vue

: 'vue\u002Fdist\u002Fvue.esm.js',\n '@': resolve('src'),\n }\n },\n module: {\n rules: [\n ...(config.dev.useEslint ? [createLintingRule()] : []),\n {\n test: \u002F\\.vue$\u002F,\n loader: 'vue-loader',\n options: vueLoaderConfig\n },\n {\n test: \u002F\\.js$\u002F,\n loader: 'babel-loader',\n include: [resolve('src'), resolve('test'), resolve('node_modules\u002Fwebpack-dev-server\u002Fclient')]\n },\n {\n test: \u002F\\.(png|jpe?g|gif|svg)(\\?.*)?$\u002F,\n loader: 'url-loader',\n options: {\n limit: 10000,\n name: utils.assetsPath('img\u002F[name].[hash:7].[ext]')\n }\n },\n {\n test: \u002F\\.(mp4|webm|ogg|mp3|wav|flac|aac)(\\?.*)?$\u002F,\n loader: 'url-loader',\n options: {\n limit: 10000,\n name: utils.assetsPath('media\u002F[name].[hash:7].[ext]')\n }\n },\n {\n test: \u002F\\.(woff2?|eot|ttf|otf)(\\?.*)?$\u002F,\n loader: 'url-loader',\n options: {\n limit: 10000,\n name: utils.assetsPath('fonts\u002F[name].[hash:7].[ext]')\n }\n }\n ]\n },\n node: {\n \u002F\u002F prevent webpack from injecting useless setImmediate polyfill because Vue\n \u002F\u002F source contains it (although only uses it if it's native).\n setImmediate: false,\n \u002F\u002F prevent webpack from injecting mocks to Node native modules\n \u002F\u002F that does not make sense for the client\n dgram: 'empty',\n fs: 'empty',\n net: 'empty',\n tls: 'empty',\n child_process: 'empty'\n }\n}\n","id":"0171b361-7e2a-4a52-ad92-5c15bd13a15f","is_binary":false,"title":"webpack.base.conf.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"BkXeApDlKZE","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"'use strict'\nconst utils = require('.\u002Futils')\nconst config = require('..\u002Fconfig')\nconst isProduction = process.env.NODE_ENV === 'production'\nconst sourceMapEnabled = isProduction\n ? config.build.productionSourceMap\n : config.dev.cssSourceMap\n\nmodule.exports = {\n loaders: utils.cssLoaders({\n sourceMap: sourceMapEnabled,\n extract: isProduction\n }),\n cssSourceMap: sourceMapEnabled,\n cacheBusting: config.dev.cacheBusting,\n transformToRequire: {\n video: ['src', 'poster'],\n source: 'src',\n img: 'src',\n image: 'xlink:href'\n }\n}\n","id":"03c29852-a58e-49cd-a95e-70ec10950097","is_binary":false,"title":"vue-loader.conf.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"HkGeCpweYWV","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"'use strict'\nconst path = require('path')\nconst config = require('..\u002Fconfig')\nconst ExtractTextPlugin = require('extract-text-webpack-plugin')\nconst packageConfig = require('..\u002Fpackage.json')\n\nexports.assetsPath = function (_path) {\n const assetsSubDirectory = process.env.NODE_ENV === 'production'\n ? config.build.assetsSubDirectory\n : config.dev.assetsSubDirectory\n\n return path.posix.join(assetsSubDirectory, _path)\n}\n\nexports.cssLoaders = function (options) {\n options = options || {}\n\n const cssLoader = {\n loader: 'css-loader',\n options: {\n sourceMap: options.sourceMap\n }\n }\n\n const postcssLoader = {\n loader: 'postcss-loader',\n options: {\n sourceMap: options.sourceMap\n }\n }\n\n \u002F\u002F generate loader string to be used with extract text plugin\n function generateLoaders (loader, loaderOptions) {\n const loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]\n\n if (loader) {\n loaders.push({\n loader: loader + '-loader',\n options: Object.assign({}, loaderOptions, {\n sourceMap: options.sourceMap\n })\n })\n }\n\n \u002F\u002F Extract CSS when that option is specified\n \u002F\u002F (which is the case during production build)\n if (options.extract) {\n return ExtractTextPlugin.extract({\n use: loaders,\n fallback: 'vue-style-loader'\n })\n } else {\n return ['vue-style-loader'].concat(loaders)\n }\n }\n\n \u002F\u002F https:\u002F\u002Fvue-loader.vuejs.org\u002Fen\u002Fconfigurations\u002Fextract-css.html\n return {\n css: generateLoaders(),\n postcss: generateLoaders(),\n less: generateLoaders('less'),\n sass: generateLoaders('sass', { indentedSyntax: true }),\n scss: generateLoaders('sass'),\n stylus: generateLoaders('stylus'),\n styl: generateLoaders('stylus')\n }\n}\n\n\u002F\u002F Generate loaders for standalone style files (outside of .vue)\nexports.styleLoaders = function (options) {\n const output = []\n const loaders = exports.cssLoaders(options)\n\n for (const extension in loaders) {\n const loader = loaders[extension]\n output.push({\n test: new RegExp('\\\\.' + extension + '

),\n use: loader\n })\n }\n\n return output\n}\n\nexports.createNotifierCallback = () =\u003E {\n const notifier = require('node-notifier')\n\n return (severity, errors) =\u003E {\n if (severity !== 'error') return\n\n const error = errors[0]\n const filename = error.file && error.file.split('!').pop()\n\n notifier.notify({\n title: packageConfig.name,\n message: severity + ': ' + error.name,\n subtitle: filename || '',\n icon: path.join(__dirname, 'logo.png')\n })\n }\n}\n","id":"bc8ae6f1-9d21-438e-8216-6b9c9faea8a0","is_binary":false,"title":"utils.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"S1ZxAavxFWN","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"https:\u002F\u002Frawcdn.githack.com\u002FAkumzy\u002Fvue-contextmenu\u002Fc8fbe5edff309ac1da3486721b702502a80d28c3\u002Fbuild\u002Flogo.png","id":"eb87ad68-164d-4534-9597-acad9a6b5a0f","is_binary":true,"title":"logo.png","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"BJgxA6DgKZ4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"'use strict'\nconst chalk = require('chalk')\nconst semver = require('semver')\nconst packageConfig = require('..\u002Fpackage.json')\nconst shell = require('shelljs')\n\nfunction exec (cmd) {\n return require('child_process').execSync(cmd).toString().trim()\n}\n\nconst versionRequirements = [\n {\n name: 'node',\n currentVersion: semver.clean(process.version),\n versionRequirement: packageConfig.engines.node\n }\n]\n\nif (shell.which('npm')) {\n versionRequirements.push({\n name: 'npm',\n currentVersion: exec('npm --version'),\n versionRequirement: packageConfig.engines.npm\n })\n}\n\nmodule.exports = function () {\n const warnings = []\n\n for (let i = 0; i \u003C versionRequirements.length; i++) {\n const mod = versionRequirements[i]\n\n if (!semver.satisfies(mod.currentVersion, mod.versionRequirement)) {\n warnings.push(mod.name + ': ' +\n chalk.red(mod.currentVersion) + ' should be ' +\n chalk.green(mod.versionRequirement)\n )\n }\n }\n\n if (warnings.length) {\n console.log('')\n console.log(chalk.yellow('To use this template, you must update following to modules:'))\n console.log()\n\n for (let i = 0; i \u003C warnings.length; i++) {\n const warning = warnings[i]\n console.log(' ' + warning)\n }\n\n console.log()\n process.exit(1)\n }\n}\n","id":"c99e981a-6ffd-4feb-bcae-9d501f60181a","is_binary":false,"title":"check-versions.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"HJyl0TDxFbE","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"'use strict'\nrequire('.\u002Fcheck-versions')()\n\nprocess.env.NODE_ENV = 'production'\n\nconst ora = require('ora')\nconst rm = require('rimraf')\nconst path = require('path')\nconst chalk = require('chalk')\nconst webpack = require('webpack')\nconst config = require('..\u002Fconfig')\nconst webpackConfig = require('.\u002Fwebpack.prod.conf')\n\nconst spinner = ora('building for production...')\nspinner.start()\n\nrm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err =\u003E {\n if (err) throw err\n webpack(webpackConfig, (err, stats) =\u003E {\n spinner.stop()\n if (err) throw err\n process.stdout.write(stats.toString({\n colors: true,\n modules: false,\n children: false, \u002F\u002F If you are using ts-loader, setting this to true will make TypeScript errors show up during build.\n chunks: false,\n chunkModules: false\n }) + '\\n\\n')\n\n if (stats.hasErrors()) {\n console.log(chalk.red(' Build failed with errors.\\n'))\n process.exit(1)\n }\n\n console.log(chalk.cyan(' Build complete.\\n'))\n console.log(chalk.yellow(\n ' Tip: built files are meant to be served over an HTTP server.\\n' +\n ' Opening index.html over file:\u002F\u002F won\\'t work.\\n'\n ))\n })\n})\n","id":"c0e83bb0-6a95-4689-9fc3-4aa5c17546df","is_binary":false,"title":"build.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"H1CA6PeY-E","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"rylCpvlFZV"},{"code":"# test-project\n\n\u003E A Vue.js project\n\n## Build Setup\n\n``` bash\n# install dependencies\nnpm install\n\n# serve with hot reload at localhost:8080\nnpm run dev\n\n# build for production with minification\nnpm run build\n\n# build for production and view the bundle analyzer report\nnpm run build --report\n\n# run unit tests\nnpm run unit\n\n# run all tests\nnpm test\n```\n\nFor a detailed explanation on how things work, check out the [guide](http:\u002F\u002Fvuejs-templates.github.io\u002Fwebpack\u002F) and [docs for vue-loader](http:\u002F\u002Fvuejs.github.io\u002Fvue-loader).\n","id":"6f8dad76-1475-4459-a4a1-ee7416e867ba","is_binary":false,"title":"README.md","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"r16ATPgK-N","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":"\u002F\u002F https:\u002F\u002Fgithub.com\u002Fmichael-ciniawsky\u002Fpostcss-load-config\n\nmodule.exports = {\n \"plugins\": {\n \"postcss-import\": {},\n \"postcss-url\": {},\n \u002F\u002F to edit target browsers: use \"browserslist\" field in package.json\n \"autoprefixer\": {}\n }\n}\n","id":"619507fb-5805-4256-9aaf-3fa8e5f8f2e3","is_binary":false,"title":".postcssrc.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"HynCavxFW4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":".DS_Store\nnode_modules\u002F\n\u002Fdist\u002F\nnpm-debug.log*\nyarn-debug.log*\nyarn-error.log*\n\u002Ftest\u002Funit\u002Fcoverage\u002F\n\n# Editor directories and files\n.idea\n.vscode\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n","id":"326805f4-dcd8-45f4-a34f-64837677f95b","is_binary":false,"title":".gitignore","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"rki0aweFZ4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":"\u002F\u002F https:\u002F\u002Feslint.org\u002Fdocs\u002Fuser-guide\u002Fconfiguring\n\nmodule.exports = {\n root: true,\n parserOptions: {\n parser: 'babel-eslint'\n },\n env: {\n browser: true,\n },\n \u002F\u002F https:\u002F\u002Fgithub.com\u002Fvuejs\u002Feslint-plugin-vue#priority-a-essential-error-prevention\n \u002F\u002F consider switching to `plugin:vue\u002Fstrongly-recommended` or `plugin:vue\u002Frecommended` for stricter rules.\n extends: ['plugin:vue\u002Fessential', 'airbnb-base'],\n \u002F\u002F required to lint *.vue files\n plugins: [\n 'vue'\n ],\n \u002F\u002F check if imports actually resolve\n settings: {\n 'import\u002Fresolver': {\n webpack: {\n config: 'build\u002Fwebpack.base.conf.js'\n }\n }\n },\n \u002F\u002F add your custom rules here\n rules: {\n \u002F\u002F don't require .vue extension when importing\n 'import\u002Fextensions': ['error', 'always', {\n js: 'never',\n vue: 'never'\n }],\n \u002F\u002F disallow reassignment of function parameters\n \u002F\u002F disallow parameter object manipulation except for specific exclusions\n 'no-param-reassign': ['error', {\n props: true,\n ignorePropertyModificationsFor: [\n 'state', \u002F\u002F for vuex state\n 'acc', \u002F\u002F for reduce accumulators\n 'e' \u002F\u002F for e.returnvalue\n ]\n }],\n \u002F\u002F allow optionalDependencies\n 'import\u002Fno-extraneous-dependencies': ['error', {\n optionalDependencies: ['test\u002Funit\u002Findex.js']\n }],\n \u002F\u002F allow debugger during development\n 'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'\n }\n}\n","id":"46d482e4-7099-41df-8f05-aed288a6b22e","is_binary":false,"title":".eslintrc.js","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"S19R6wgYWE","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":"\u002Fbuild\u002F\n\u002Fconfig\u002F\n\u002Fdist\u002F\n\u002F*.js\n\u002Ftest\u002Funit\u002Fcoverage\u002F\n","id":"84f2d35e-d8ff-46f3-bf8f-3ed9e4952aa0","is_binary":false,"title":".eslintignore","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"SJYCTDxtW4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":"root = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size = 2\nend_of_line = lf\ninsert_final_newline = true\ntrim_trailing_whitespace = true\n","id":"b3ef0bab-196c-470d-8c8f-c42613c742cb","is_binary":false,"title":".editorconfig","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"rkuRawlYbV","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":"{\n \"presets\": [\n [\"env\", {\n \"modules\": false,\n \"targets\": {\n \"browsers\": [\"\u003E 1%\", \"last 2 versions\", \"not ie \u003C= 8\"]\n }\n }],\n \"stage-2\"\n ],\n \"plugins\": [\"transform-vue-jsx\", \"transform-runtime\"],\n \"env\": {\n \"test\": {\n \"presets\": [\"env\", \"stage-2\"],\n \"plugins\": [\"transform-vue-jsx\", \"transform-es2015-modules-commonjs\", \"dynamic-import-node\"]\n }\n }\n}\n","id":"95c3ba34-bd1a-408b-aa0a-e518758a26cc","is_binary":false,"title":".babelrc","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"rJvRTvgYW4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":null},{"code":"","id":"dbb9296d-ee9f-4452-adb3-8fbb6472d4c5","is_binary":false,"title":".keep","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:35:46","upload_id":null,"shortid":"rJ806DeKZ4","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"HkApPxF-E"},{"code":"\u003Ctemplate\u003E\n \u003Cdiv id=\"app\"\u003E\n \u003Cimg width=\"25%\" src=\".\u002Fassets\u002Flogo.png\" \u002F\u003E \u003CHelloWorld \u002F\u003E\n \u003C!-- Add the component at your app root component --\u003E\n \u003CContextMenu \u002F\u003E\n \u003C\u002Fdiv\u003E\n\u003C\u002Ftemplate\u003E\n\n\u003Cscript\u003E\nimport HelloWorld from \".\u002Fcomponents\u002FHelloWorld\";\nimport ContextMenu from \".\u002Fpartials\u002FContextMenu.vue\";\nexport default {\n name: \"App\",\n components: {\n HelloWorld,\n ContextMenu\n }\n};\n\u003C\u002Fscript\u003E\n\n\u003Cstyle\u003E\n#app {\n font-family: \"Avenir\", Helvetica, Arial, sans-serif;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-align: center;\n color: #2c3e50;\n margin-top: 60px;\n}\n\u003C\u002Fstyle\u003E\n","id":"a31dd3aa-7028-4546-8a3f-5141bc5fe769","is_binary":false,"title":"App.vue","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T15:54:09","upload_id":null,"shortid":"SJ2gApDgYbV","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"S1fRTPlF-E"},{"code":"\u003Ctemplate\u003E\n \u003Cdiv class=\"hello\"\u003E\n \u003Ch1\u003E{{ msg }}\u003C\u002Fh1\u003E\n \u003Ch2\u003EEssential Links\u003C\u002Fh2\u003E\n \u003Cp\u003Eright-click on any link\u003C\u002Fp\u003E\n \u003Cul\u003E\n \u003Cli\u003E\u003Ca href=\"https:\u002F\u002Fvuejs.org\" target=\"_blank\"\u003E Core Docs \u003C\u002Fa\u003E\u003C\u002Fli\u003E\n \u003Cli\u003E\u003Ca href=\"https:\u002F\u002Fforum.vuejs.org\" target=\"_blank\"\u003E Forum \u003C\u002Fa\u003E\u003C\u002Fli\u003E\n \u003Cli\u003E\n \u003Ca href=\"https:\u002F\u002Fchat.vuejs.org\" target=\"_blank\"\u003E Community Chat \u003C\u002Fa\u003E\n \u003C\u002Fli\u003E\n \u003Cli\u003E\u003Ca href=\"https:\u002F\u002Ftwitter.com\u002Fvuejs\" target=\"_blank\"\u003E Twitter \u003C\u002Fa\u003E\u003C\u002Fli\u003E\n \u003Cbr \u002F\u003E\n \u003Cli\u003E\n \u003Ca href=\"http:\u002F\u002Fvuejs-templates.github.io\u002Fwebpack\u002F\" target=\"_blank\"\u003E\n Docs for This Template\n \u003C\u002Fa\u003E\n \u003C\u002Fli\u003E\n \u003C\u002Ful\u003E\n \u003Ch2\u003EEcosystem\u003C\u002Fh2\u003E\n \u003Cul\u003E\n \u003Cli\u003E\n \u003Ca href=\"http:\u002F\u002Frouter.vuejs.org\u002F\" target=\"_blank\"\u003E vue-router \u003C\u002Fa\u003E\n \u003C\u002Fli\u003E\n \u003Cli\u003E\u003Ca href=\"http:\u002F\u002Fvuex.vuejs.org\u002F\" target=\"_blank\"\u003E vuex \u003C\u002Fa\u003E\u003C\u002Fli\u003E\n \u003Cli\u003E\n \u003Ca href=\"http:\u002F\u002Fvue-loader.vuejs.org\u002F\" target=\"_blank\"\u003E vue-loader \u003C\u002Fa\u003E\n \u003C\u002Fli\u003E\n \u003Cli\u003E\n \u003Ca href=\"https:\u002F\u002Fgithub.com\u002Fvuejs\u002Fawesome-vue\" target=\"_blank\"\u003E\n awesome-vue\n \u003C\u002Fa\u003E\n \u003C\u002Fli\u003E\n \u003C\u002Ful\u003E\n \u003C\u002Fdiv\u003E\n\u003C\u002Ftemplate\u003E\n\n\u003Cscript\u003E\nexport default {\n name: \"HelloWorld\",\n data() {\n return {\n msg: \"How to create a custom context-menu\"\n };\n },\n methods: {\n openLink(target) {\n console.log(target);\n },\n copyLink(target) {\n console.log(target);\n },\n linksHandler() {\n \u002F\u002F let's handler all contextmenu event on all archor tags\n let links = this.$el.querySelectorAll(\"a\");\n links.forEach(element =\u003E {\n element.addEventListener(\n \"contextmenu\",\n event =\u003E {\n const ctxMenuData = [\n {\n title: \"Open link\",\n handler: this.openLink.bind(this, element)\n },\n {\n type: \"divider\"\n },\n {\n title: \"Copy link\",\n handler: this.copyLink.bind(this, element)\n }\n ];\n \u002F\u002F two properties are needed\n \u002F\u002F the event and your options\n this.$root.$emit(\"contextmenu\", { event, ctxMenuData });\n },\n false\n );\n });\n }\n },\n mounted() {\n this.linksHandler();\n }\n};\n\u003C\u002Fscript\u003E\n\n\u003C!-- Add \"scoped\" attribute to limit CSS to this component only --\u003E\n\u003Cstyle scoped\u003E\nh1,\nh2 {\n font-weight: normal;\n}\nul {\n list-style-type: none;\n padding: 0;\n}\nli {\n display: inline-block;\n margin: 0 10px;\n}\na {\n color: #42b983;\n}\n\u003C\u002Fstyle\u003E\n","id":"709c76c8-2eb8-4705-ac97-ec2520a53466","is_binary":false,"title":"HelloWorld.vue","sha":null,"inserted_at":"2019-01-01T15:35:46","updated_at":"2019-01-01T20:20:20","upload_id":null,"shortid":"rk0gCpPeK-E","source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d","directory_shortid":"By4RTwgYbN"}],"preview_secret":null,"owned":false,"draft":true,"original_git":{"path":"","branch":"master","repo":"vue-contextmenu","username":"Akumzy","commit_sha":"c8fbe5edff309ac1da3486721b702502a80d28c3"},"entry":"src\u002Fmain.js","always_on":false,"screenshot_url":"https:\u002F\u002Fscreenshots.codesandbox.io\u002Fp99q98n6xm\u002F6.png","privacy":0,"ai_consent":false,"id":"p99q98n6xm","restrictions":{"free_plan_editing_restricted":false,"live_sessions_restricted":true},"custom_template":null,"external_resources":[],"v2":false,"free_plan_editing_restricted":false,"feature_flags":{"comments":false,"container_lsp":false},"user_liked":false,"author":{"id":"5cdef6d4-a5ad-4cd8-83c1-d4212a9ca9f6","name":"Akuma Isaac Akuma","username":"Akumzy","avatar_url":"https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F25849232?v=4","personal_workspace_id":"9c0a6d04-084d-479a-a9cc-9556ccabcd6e","subscription_plan":null,"subscription_since":null},"source_id":"0a2abcfc-7149-4675-a30c-180a6edf5b9d"};