Можете поделиться конфигом vuejs 2 с webpack 2?

Question

[gpyshenko]

Вот мой конфиг:

"scripts": {
    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
  },
  "dependencies": {
    "uglifyjs-webpack-plugin": "^0.4.3",
    "vue": "^2.3.3",
    "vue-router": "^2.5.3"
  },
  "devDependencies": {
    "babel-core": "^6.0.0",
    "babel-loader": "^6.0.0",
    "babel-preset-env": "^1.5.1",
    "cross-env": "^3.0.0",
    "css-loader": "^0.25.0",
    "file-loader": "^0.9.0",
    "node-sass": "^4.5.0",
    "sass-loader": "^5.0.1",
    "vue-loader": "^12.1.0",
    "vue-template-compiler": "^2.3.3",
    "webpack": "^2.6.1",
    "webpack-dev-server": "^2.4.5"
  }

Можете подправить его чтобы у меня был Pug(Jade) шаблонизатор, был Autoprefixer и чтобы css сжимался. А то я перешел с Gulp и пока что не понимаю как настраивать)) Если для полной работоспособности нужны настройки в webpack.config.js то тоже скиньте))

Comments

[Johniq]

а чем vue-cli не угодил? его можно под себя замутить, или использовать облегченную версию https://vuejs.org/2015/12/28/vue-cli/

[gpyshenko]

Johniq: Там нет Pug, нет минификатора css и js и нет autoprefixer)) Поэтому и прошу здесь помощи)) Если можешь скинь мне packaje.json с этими зависимостями чтобы я просто npm i вбил и все установилось))
Можешь?

Answer 1

[Антон Антон]

через npm глобально ставьте vue-cli, затем запускайте vue-init webpack-simple, добавляйте vue-router и что вам там еще нужно руками через npm.
Шаблон "webpack" работает, но только в том объеме, в котором он есть. По крайней мере bootstrap-vue не заработал (css не подключились, в отличии от шаблона webpack-simple). Ну, или я его не умею готовить.

Вся магия происходит сама, если все делать в .vue файлах, ответственным за это является vue-loader:

• Поддержка ES2015 по умолчанию;
  
• Позволяет использовать разные загрузчики Webpack для разных частей Vue компонента, например, SASS для <style> и Jade для <template>;
  
• Позволяет использовать пользовательские секции во .vue-файлах, применяя к ним пользовательские цепочки загрузчиков
  
• Обращается со статическими ресурсами, указанными в <style> и <template>, как с зависимостями модуля, и обрабатывает их Webpack загрузчиками;
  
• Может эмулировать scoped CSS для компонентов;
  
• Поддерживает горячую замену модулей.
  

Подробнее тут: vue-loader.vuejs.org/ru/configurations/pre-process...

Comments

[gpyshenko]

Спасибо)) Я уже сам допер)) Но ссылка полезная)) Насчет бутстрапа, ну я им не пользуюсь, все верстаю флексами))

[Антон Антон]

gpyshenko: ну, есть вероятность, что кроме bootstrap-vue может еще что-то требовать import файла css по относительному пути