Skip to content

Instantly share code, notes, and snippets.

@dcvezzani
Last active April 26, 2018 01:52
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dcvezzani/a677d14903e946233e0943fa40619bf2 to your computer and use it in GitHub Desktop.
Save dcvezzani/a677d14903e946233e0943fa40619bf2 to your computer and use it in GitHub Desktop.
I would like to customize my vuejs app; I do so after the project has been scaffolded. Perl is wonderful for string replacements like this.
vue init webpack sudoku
cd sudoku
yarn add bulma node-sass sass-loader
mkdir src/assets/sass
touch src/assets/sass/main.scss
echo -e "\n@import '~bulma/bulma'" >> src/assets/sass/main.scss
perl -i -0pe 's#^(Vue.config.productionTip.*$)#// Require the main Sass manifest file\nrequire\('"'"'./assets/sass/main.scss'"'"'\);\n\n\1#gms' /Users/dcvezzani/greenseedtechnologies/sudoku/src/main.js
perl -i -0pe 's#^( "dev": .*)$# "open": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --open",\n\1#gms' /Users/dcvezzani/greenseedtechnologies/sudoku/package.json
perl -i -0pe 's#(path: ./)(.,)#\1hello\2#g; s#^( routes: .*)$#\1\n {\n path: "/",\n name: "Sudoku",\n component: Sudoku\n },#gm; s#^(import HelloWorld.*)$#\1\nimport Sudoku from "@/components/Sudoku"#gm' /Users/dcvezzani/greenseedtechnologies/sudoku/src/router/index.js
sed -i'' -e '/logo.png/d' /Users/dcvezzani/greenseedtechnologies/sudoku/src/App.vue
cp /Users/dcvezzani/greenseedtechnologies/sudoku/src/components/HelloWorld.vue /Users/dcvezzani/greenseedtechnologies/sudoku/src/components/Sudoku.vue
perl -i -0pe 's#<div class="hello">.*</div>#<div class="sudoku">\n </div>#gms; s#HelloWorld#Sudoku#g; s#<style scoped>.*</style>#<style scoped>\n</style>#gms' /Users/dcvezzani/greenseedtechnologies/sudoku/src/router/index.js
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment