Skip to content
This repository was archived by the owner on Dec 16, 2022. It is now read-only.

refactor(templates): use Vue CLI for 2.x.x #402

Merged
merged 3 commits into from
Apr 19, 2019
Merged

refactor(templates): use Vue CLI for 2.x.x #402

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e8ff35a
refactor(templates): use Vue CLI
samouss Apr 18, 2019
8ff4323
fix(templates): use port 3000 for Vue
samouss Apr 18, 2019
1e64733
update name in noscript
Haroenv Apr 19, 2019
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
Binary file added e2e/__image_snapshots__/vue-instantsearch/public/favicon.ico-snap.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
0 src/templates/Vue InstantSearch/favicon.png → ...instantsearch/public/favicon.png-snap.png
View file
Open in desktop
File renamed without changes
263 changes: 88 additions & 175 deletions e2e/__snapshots__/templates.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4963,15 +4963,6 @@ Array [
]
`;

exports[`Templates Vue InstantSearch File content: .babelrc 1`] = `
"{
\\"presets\\": [
[\\"env\\", { \\"modules\\": false }],
\\"stage-3\\"
]
}"
`;

exports[`Templates Vue InstantSearch File content: .editorconfig 1`] = `
"root = true

Expand All @@ -4986,19 +4977,46 @@ trim_trailing_whitespace = true"

exports[`Templates Vue InstantSearch File content: .eslintrc.js 1`] = `
"module.exports = {
extends: 'algolia/vue',
// extends from 'prettier/vue' until we update the Algolia configuration
extends: ['algolia/vue', 'prettier/vue'],
rules: {
'import/no-commonjs': 'off',
// enable the rule until we update the Algolia configuration
'vue/component-name-in-template-casing': ['error', 'kebab-case'],
},
};"
`;

exports[`Templates Vue InstantSearch File content: .gitignore 1`] = `
"node_modules/
npm-debug.log
yarn-debug.log
yarn-error.log
dist/"
".DS_Store
node_modules
/dist

# local env files
.env.local
.env.*.local

# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?"
`;

exports[`Templates Vue InstantSearch File content: .prettierrc 1`] = `
"{
\\"singleQuote\\": true,
\\"proseWrap\\": \\"never\\",
\\"trailingComma\\": \\"es5\\"
}"
`;

exports[`Templates Vue InstantSearch File content: README.md 1`] = `
Expand All @@ -5025,56 +5043,10 @@ yarn start
Open http://localhost:3000 to see your app."
`;

exports[`Templates Vue InstantSearch File content: index.html 1`] = `
"<!DOCTYPE html>
<html lang=\\"en\\">

<head>
<meta charset=\\"utf-8\\">
<meta name=\\"viewport\\" content=\\"width=device-width, initial-scale=1, shrink-to-fit=no\\">
<meta name=\\"theme-color\\" content=\\"#000000\\">

<link rel=\\"manifest\\" href=\\"manifest.json\\">
<link rel=\\"shortcut icon\\" href=\\"favicon.png\\">

<!--
Do not use @7 in production, use a complete version like x.x.x, see website for latest version:
https://www.algolia.com/doc/guides/building-search-ui/installation/react/#load-the-style
-->
<link rel=\\"stylesheet\\" href=\\"https://cdn.jsdelivr.net/npm/instantsearch.css@7/themes/algolia-min.css\\">

<title>vue-instantsearch-app</title>
</head>

<body>
<noscript>
You need to enable JavaScript to run this app.
</noscript>

<div id=\\"app\\"></div>

<script src=\\"/dist/build.js\\"></script>
</body>

</html>"
`;

exports[`Templates Vue InstantSearch File content: manifest.json 1`] = `
"{
\\"short_name\\": \\"vue-instantsearch-app\\",
\\"name\\": \\"vue-instantsearch-app Sample\\",
\\"icons\\": [
{
\\"src\\": \\"favicon.png\\",
\\"sizes\\": \\"64x64 32x32 24x24 16x16\\",
\\"type\\": \\"image/x-icon\\"
}
],
\\"start_url\\": \\"./index.html\\",
\\"display\\": \\"standalone\\",
\\"theme_color\\": \\"#000000\\",
\\"background_color\\": \\"#ffffff\\"
}"
exports[`Templates Vue InstantSearch File content: babel.config.js 1`] = `
"module.exports = {
presets: ['@vue/app'],
};"
`;

exports[`Templates Vue InstantSearch File content: package.json 1`] = `
Expand All @@ -5083,23 +5055,55 @@ exports[`Templates Vue InstantSearch File content: package.json 1`] = `
\\"version\\": \\"1.0.0\\",
\\"private\\": true,
\\"scripts\\": {
\\"start\\": \\"cross-env NODE_ENV=development webpack-dev-server --port 3000 --hot\\",
\\"build\\": \\"cross-env NODE_ENV=production webpack --progress --hide-modules\\",
\\"lint\\": \\"eslint --ext .js,.vue .\\",
\\"start\\": \\"vue-cli-service serve --port 3000\\",
\\"build\\": \\"vue-cli-service build\\",
\\"lint\\": \\"vue-cli-service lint\\",
\\"lint:fix\\": \\"npm run lint -- --fix\\"
},
\\"browserslist\\": [
\\"> 1%\\",
\\"last 2 versions\\",
\\"not ie <= 8\\"
],
\\"partialDependencies\\": {
\\"vue-instantsearch\\": \\"2.0.0\\"
}
}"
`;

exports[`Templates Vue InstantSearch File content: public/index.html 1`] = `
"<!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.png\\">
<!--
Do not use @7 in production, use a complete version like x.x.x, see website for latest version:
https://www.algolia.com/doc/guides/building-search-ui/installation/react/#load-the-style
-->
<link rel=\\"stylesheet\\" href=\\"https://cdn.jsdelivr.net/npm/instantsearch.css@7/themes/algolia-min.css\\">
<title>vue-instantsearch-app</title>
</head>
<body>
<noscript>
<strong>We're sorry but vue-instantsearch-app doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id=\\"app\\"></div>
<!-- built files will be auto injected -->
</body>
</html>"
`;

exports[`Templates Vue InstantSearch File content: src/App.vue 1`] = `
"<template>
<div>
<header class=\\"header\\">
<h1 class=\\"header-title\\">
<a href=\\"/\\">vue-instantsearch-app</a>
<a href=\\"/\\">
vue-instantsearch-app
</a>
</h1>
<p class=\\"header-subtitle\\">
using
Expand All @@ -5110,32 +5114,25 @@ exports[`Templates Vue InstantSearch File content: src/App.vue 1`] = `
</header>

<div class=\\"container\\">
<ais-instant-search
:search-client=\\"searchClient\\"
index-name=\\"indexName\\"
>
<ais-instant-search :search-client=\\"searchClient\\" index-name=\\"indexName\\">
<div class=\\"search-panel\\">
<div class=\\"search-panel__filters\\">
<ais-refinement-list attribute=\\"facet1\\" />
<ais-refinement-list attribute=\\"facet2\\" />
</div>

<div class=\\"search-panel__results\\">
<ais-search-box placeholder=\\"Search placeholder\\" />
<div class=\\"searchbox\\">
<ais-search-box placeholder=\\"Search placeholder\\" />
</div>
<ais-hits>
<template slot=\\"item\\" slot-scope=\\"{ item }\\">
<article>
<h1>
<ais-highlight
:hit=\\"item\\"
attribute=\\"attribute1\\"
/>
<ais-highlight :hit=\\"item\\" attribute=\\"attribute1\\" />
</h1>
<p>
<ais-highlight
:hit=\\"item\\"
attribute=\\"attribute2\\"
/>
<ais-highlight :hit=\\"item\\" attribute=\\"attribute2\\" />
</p>
</article>
</template>
Expand All @@ -5157,16 +5154,12 @@ import algoliasearch from 'algoliasearch/lite';
export default {
data() {
return {
searchClient: algoliasearch(
'appId',
'apiKey'
),
searchClient: algoliasearch('appId', 'apiKey'),
};
},
};
</script>


<style>
body,
h1 {
Expand Down Expand Up @@ -5244,110 +5237,30 @@ em {

exports[`Templates Vue InstantSearch File content: src/main.js 1`] = `
"import Vue from 'vue';
import App from './App.vue';
import InstantSearch from 'vue-instantsearch';
import App from './App.vue';

Vue.config.productionTip = false;

Vue.use(InstantSearch);

// eslint-disable-next-line no-new
new Vue({
el: '#app',
render: h => h(App),
});"
`;

exports[`Templates Vue InstantSearch File content: webpack.config.js 1`] = `
"const path = require('path');
const webpack = require('webpack');

module.exports = {
entry: './src/main.js',
output: {
path: path.resolve(__dirname, './dist'),
publicPath: '/dist/',
filename: 'build.js',
},
module: {
rules: [
{
test: /\\\\.css$/,
use: ['vue-style-loader', 'css-loader'],
},
{
test: /\\\\.vue$/,
loader: 'vue-loader',
options: {
loaders: {},
// other vue-loader options go here
},
},
{
test: /\\\\.js$/,
loader: 'babel-loader',
exclude: /node_modules/,
},
{
test: /\\\\.(png|jpg|gif|svg)$/,
loader: 'file-loader',
options: {
name: '[name].[ext]?[hash]',
},
},
],
},
resolve: {
alias: {
vue$: 'vue/dist/vue.esm.js',
},
extensions: ['*', '.js', '.vue', '.json'],
},
devServer: {
historyApiFallback: true,
noInfo: true,
overlay: true,
port: 3000,
},
performance: {
hints: false,
},
devtool: '#eval-source-map',
};

if (process.env.NODE_ENV === 'production') {
module.exports.devtool = '#source-map';
// http://vue-loader.vuejs.org/en/workflow/production.html
module.exports.plugins = (module.exports.plugins || []).concat([
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '\\"production\\"',
},
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
warnings: false,
},
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
}),
]);
}"
}).$mount('#app');"
`;

exports[`Templates Vue InstantSearch Folder structure: contains the right files 1`] = `
Array [
".babelrc",
".editorconfig",
".eslintrc.js",
".gitignore",
".prettierrc",
"README.md",
"favicon.png",
"index.html",
"manifest.json",
"babel.config.js",
"package.json",
"public/favicon.png",
"public/index.html",
"src/App.vue",
"src/main.js",
"webpack.config.js",
]
`;
6 changes: 0 additions & 6 deletions src/templates/Vue InstantSearch/.babelrc.template
View file
Open in desktop

This file was deleted.

5 changes: 4 additions & 1 deletion src/templates/Vue InstantSearch/.eslintrc.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
module.exports = {
extends: 'algolia/vue',
// extends from 'prettier/vue' until we update the Algolia configuration
extends: ['algolia/vue', 'prettier/vue'],
rules: {
'import/no-commonjs': 'off',
// enable the rule until we update the Algolia configuration
'vue/component-name-in-template-casing': ['error', 'kebab-case'],
},
};
Loading