Webpack, vue, node réalisent le partage de code sur une seule page-js tutoriel-php.cn

Webpack, vue, node réalisent le partage de code sur une seule page

小云云

Libérer： 2018-02-03 11:20:00

original

1747 Les gens l'ont consulté

Cet article présente principalement webpack + vue + node pour créer une seule page (pour commencer). Les amis qui en ont besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

Adresse de téléchargement 1.node : http://nodejs.cn/download/, vérifiez la version du nœud et de npm une fois l'installation terminée

2. Miroir Taobao : npm install cnpm -g --registry=https://registry.npm.taobao.org Le miroir Taobao est beaucoup plus rapide que npm Vous pouvez utiliser directement cnpm au lieu de npm

<.>

3. Installez vue-cli : cnpm install -g vue-cli

Installez le webpack : cnpm install -g webpack

-g signifie installation globale

Processus de programmation Si vous devez introduire un module, vous pouvez cnpm installer --save

Par exemple, si vous devez installer le module de routage vue-router, utilisez simplement le cnpm d'échafaudage install vue-router --save

4. Construisez l'application vue de webpack : vue init webpack

Spécial ici Mentionnez webpack Lors de l'installation du modèle webpack plus tôt, il était possible d'utiliser ESLint pour standardiser votre code

ESLint peut être une mauvaise nouvelle pour les amis. qui ne font pas beaucoup attention à l'indentation du code. Veuillez le modifier un peu le code du programme, si l'indentation ne répond pas aux normes, ou même les espaces peuvent provoquer un tas de putains d'erreurs

Indiquez la vue-cli. modèle. Le modèle vue-cli est divisé en modèle officiel, modèle personnalisé et modèle local

Les modèles officiels sont divisés en

browserify -- Browserify + vueify avec avancé fonctions pour le développement officiel
browserify-simple -- Browserify + vueify avec des fonctions de base pour un développement rapide
simple -- HTML unique pour développer le Application Vue.js la plus simple
webpack -- Webpack avec fonctions avancées + vue-loader pour le développement formel
webpack-simple -- Webpack avec fonctions de base + vue-loader pour un développement rapide

5. Dépendances d'installation d'échafaudage

6. Exécutez-le directement pour voir l'effet.

PS : j'ai écrit une démo qui combine le routage, l'imbrication de routage, le sous-routage, l'acquisition de données inter-domaines à distance, le bootstrap et autres fonctions

Le code a été téléchargé sur le mien github, adresse : https://github.com/LeonardLmyt/learngit/tree/master/vue-single-page