Maison > interface Web > Voir.js > Comment installer des dépendances dans vuejs

Comment installer des dépendances dans vuejs

青灯夜游
Libérer: 2023-01-13 00:45:46
original
16389 Les gens l'ont consulté

Comment installer les dépendances de vuejs : 1. Installez node et cnpm ; 2. Installez l'outil de construction d'échafaudage vue-cli ; 3. Construisez le projet avec vue-cli 4. Ouvrez la fenêtre de commande cmd et utilisez la commande cd ; entrez le dossier spécifique du projet Medium; 5. Exécutez la commande "cnpm install" pour installer les dépendances.

Comment installer des dépendances dans vuejs

L'environnement d'exploitation de ce tutoriel : système Windows 7, vue version 2.9.6, ordinateur DELL G3.

1. Environnement de développement

vue environnement de développement recommandé :

Node.js : javascript runtime (runtime), différents systèmes exécutent directement divers langages de programmation

npm : gestionnaire de packages sous Nodejs.

webpack : Son objectif principal est de préparer toutes les ressources statiques qui doivent être publiées par le navigateur via la syntaxe CommonJS, telles que la fusion et l'empaquetage des ressources.

vue-cli : Modèle de projet Vue généré par l'utilisateur

2. Configuration de l'environnement

Installer node.js :
1. Téléchargez et installez node depuis le site officiel de node.js Le processus d'installation est très simple. .
2. La version npm doit être supérieure à 3.0. Si elle est inférieure à cette version, vous devez la mettre à niveau :

# 查看版本
$ npm -v
2.3.0

#升级 npm
cnpm install npm -g
Copier après la connexion

3. Basé sur node.js, utilisez le miroir Taobao npm pour installer les dépendances associées. Étant donné que l'utilisation de npm en Chine sera très lente, il est recommandé d'utiliser le miroir Taobao NPM (http://npm.taobao.org/)

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
Copier après la connexion

Une fois terminé, nous pouvons utiliser cnpm au lieu de npm pour installer les packages dépendants.

Trois. Installez l'outil de construction d'échafaudage vue-cli

Installez l'échafaudage global vue-cli pour aider à créer le cadre de modèle requis

$ cnpm install -g vue-cli
# 回车,等待安装...
$ vue
# 回车,若出现vue信息说明表示成功
Copier après la connexion

Construisez le projet avec vue-cli

# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
This will install Vue 2.x version of the template.

For Vue 1.x use: vue init webpack#1.0 my-project

? Project name my-project
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes

   vue-cli · Generated "my-project".

   To get started:

     cd my-project
     npm install
     npm run dev

   Documentation can be found at https://vuejs-templates.github.io/webpack
Copier après la connexion

Cinq. Installez les dépendances

dans cmd

1). Entrez : cd my-project (nom du projet), appuyez sur Entrée, entrez le dossier spécifique du projetcd my-project(项目名),回车,进入到具体项目文件夹

2).输入:cnpm install,回车,等待一小会儿

回到项目文件夹,会发现项目结构里,多了一个node_modules文件夹(该文件里的内容就是之前安装的依赖)

六、测试环境是否搭建成功

方法1:在cmd里输入:npm run dev

2). Entrez : cnpm install. , appuyez sur Entrée, attendez un peu

Retournez dans le dossier du projet, vous constaterez qu'il y a un dossier node_modules supplémentaire dans la structure du projet (le contenu de ce fichier est constitué des dépendances précédemment installées)

6. Si l'environnement de test est configuré avec succès

🎜🎜Méthode 1 : Entrez dans cmd : npm run dev🎜🎜Méthode 2 : Entrez dans le navigateur : localhost:8080 (le port par défaut est 8080 )🎜🎜Connexe recommandé : "🎜Tutoriel vue.js🎜"🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
vue
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal