同社は、同社の練習は最初だけで前に聞いていないVUEを使用して、フロントエンドに来たことがわかりました。その後は、コードを確認する必要が来たが、しかし何のドキュメント何か何ではありません
あなたは、私が設定して実行して欲求不満の多くで、その結果、理解を容易にするために一緒にFBIの前面と背面のいずれかを実行したい、勉強して所有する必要がある、私は利便性について書きたかったです
私たちは、ピット鉱山、直接実行している良いはしないでください
IDEAプラグインVUEの最初に、コンフィギュレーション
[ファイル]をクリックします - >設定 - >プラグイン - >検索vue.jsは、プラグインのインストール、次の図は、私がインストールされています。
第二に、Node.jsの環境を構築します
Node.jsのは、に行くことができるのインストールダウンロードして公式サイト:インストールプロセスは非常に簡単で、ライン上で次のステップを指示
インストールが成功したかどうかをテストします。管理者CMDでコマンドラインモードを開くには
直接、そのため、インストールが完了したら、コマンドラインツール、入力ノードを開き、-vバージョン番号が表示された場合は、正常にインストール、NPMのパッケージマネージャは、ノードに統合されています
NPM NPM -vバージョン情報を表示します入力してください
まあ、ノード環境が正常に、いくつかは、何らかの理由でブロックされたリソースまたは外国の資源をNPMので、依存パッケージをインストールNPM使用した場合、多くの場合、故障の原因となり、インストールされています
だから、また、あなたは、NPM国内ミラー---- cnpmをインストールする必要があります
第三に、インストールcnpmは(なお、すべての管理者モード走行)
入力NPMコマンドラインで-g cnpm --registry =のhttpをインストール:インストールを待ち、その後//registry.npm.taobao.orgた後、インストールが完了すると、我々はcnpmをインストールNPMの代わりに使用することができます
依存パッケージ。
第四に、インストールVUE-cliの足場ビルドツール(すべての管理者が実行することに注意してください)
コマンドラインでコマンドが-g VUE-CLIをインストールcnpm実行し、その後、上記の3つのステップで、インストールが完了するのを待ち、私たちの環境とツールが用意され、その後、我々は使用し始めました
VUE-CLIプロジェクトをビルドします
第五に、プロジェクトを実行ビルドします
1.私がここに持っているプロジェクトである、あなたは、名前の行にするプロジェクトディレクトリにcdを必要とします
然后需要输入命令:vue init webpack frontend (这里命令的意思是初始化一个项目,项目名称是frontend,其中webpack是构建工具,
也就是整个项目时基于webpack的)
运行命令初始化的时候会让用户输入几个基本的选项,如项目名称、描述、作者等信息,可以直接回车默认就可以了。
六、安装项目依赖资源
在项目的根目录下面会有一个package.json的文件
这里列出了项目依赖资源需要安装
首先需要cd到项目目录中去,然后输入cnpm install 等待安装,安装中会出现警告信息,有的会出现栈溢出等错误,我就是在这里遇到了,一般
第一次安装没事,如果安装过的,可以卸载了在重新安装
七、运行项目
运行命令npm run dev会用热加载的方式运行我们的应用,热加载可以让我们在修改完代码后不用手动刷新,浏览器就能实时看到修改后的效果
我们也可以在IDEA中配置运行
点击edit configurations配置,添加一个npm
然后就可以在IDEA中运行了。