Home  >  Q&A  >  body text

javascript - A problem encountered when learning vue-loader, please advise

I am learning vue-loader, and according to the method in the video,
I created a new file
1 index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <app></app>
    <script src="build.js"></script>
</body>
</html>

2 main.js

import Vue from "vue";

3 webpack.config.js

module.exports={
    entry:'./main.js',
    output:{
        path:__dirname,
        filename:"build.js"
    }
}

4 Empty App.vue file

5 After passing npm init, scripts was changed to the execution command

6 Downloaded webpck webpack-dev-server through cnpm install webpack webpack-dev-server

After finally passing npm run dev, the error is reported as follows

ERROR in ./main.js
Module not found: Error: Can't resolve 'vue' in '....vue-loader-demo'
@./main.js 1:0 -22
@multi ./~/_webpack-dev-server@2.4.5@webpack-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./main.js
webpack:Failed to compile.

Kneel down and thank you all, waiting online

習慣沉默習慣沉默2684 days ago759

reply all(7)I'll reply

  • 黄舟

    黄舟2017-05-19 10:16:31

    missing vue

    npm isntall vue --save-dev

    reply
    0
  • 阿神

    阿神2017-05-19 10:16:31

    How to compile vue with webpack? Have you installed vue-loader

    reply
    0
  • 阿神

    阿神2017-05-19 10:16:31

    What is the configuration of webpack? ? ?

    How to compile vue?

    Get a vue loader

    module: {
            loaders: [{
                    test: /\.vue$/,
                    loader: 'vue'
                }]
           }

    reply
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-19 10:16:31

    vue is not installed.

    reply
    0
  • 给我你的怀抱

    给我你的怀抱2017-05-19 10:16:31

    First try the following two steps:
    1. Install vue-loader dependency locally

    cnpm isntall vue-loader --save-dev
    

    After successful installation, the package.json and devDependencies items in the vue-loader-demo folder will display vue-loader and the corresponding version number, for example:

      "devDependencies": {
        "vue-loader": "^11.3.4"
      }

    2. Add the configuration of vue-loader in webpack

       module: {
            rules: [
              {
                test: /\.vue$/,
                loader: 'vue-loader'
              }
       ]}

    reply
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-19 10:16:31

    vue is not installed

    reply
    0
  • 某草草

    某草草2017-05-19 10:16:31

    Question: Is there a package.json? Is there vue in the dependency?

    reply
    0
  • Cancelreply