Question

我的应用正在运行https://github.com/scotch-io/vue-todo

我也尝试过为每个待办事项添加一个datepicker字段。我正在使用https://github.com/charliekassel/vuejs-datepicker。

我使用npm install vuejs-datepicker --save安装了datepicker，并添加了src / App.vue：

import Datepicker from 'vuejs-datepicker';

Vue.component('my-component', {
    components: {
        Datepicker
    }
});

现在我收到了错误：

ERROR in ./src/App.vue

  ✘  https://google.com/#q=import%2Ffirst       Absolute imports should come before relative imports  
  /Users/marklocklear/sandbox/vuejs/vue-todo/src/App.vue:17:24
  import Datepicker from 'vuejs-datepicker';
                          ^

  ✘  http://eslint.org/docs/rules/no-undef      'Vue' is not defined                                  
  /Users/marklocklear/sandbox/vuejs/vue-todo/src/App.vue:19:1
  Vue.component('my-component', {
   ^

  ✘  http://eslint.org/docs/rules/indent        Expected indentation of 2 spaces but found 4          
  /Users/marklocklear/sandbox/vuejs/vue-todo/src/App.vue:20:5
      components: {
       ^

  ✘  http://eslint.org/docs/rules/indent        Expected indentation of 6 spaces but found 8          
  /Users/marklocklear/sandbox/vuejs/vue-todo/src/App.vue:21:9
          Datepicker
           ^

  ✘  http://eslint.org/docs/rules/comma-dangle  Missing trailing comma                                
  /Users/marklocklear/sandbox/vuejs/vue-todo/src/App.vue:21:19
          Datepicker
                     ^

  ✘  http://eslint.org/docs/rules/comma-dangle  Missing trailing comma                                
  /Users/marklocklear/sandbox/vuejs/vue-todo/src/App.vue:22:6
      }
        ^


✘ 6 problems (6 errors, 0 warnings)


Errors:
  2  http://eslint.org/docs/rules/comma-dangle
  2  http://eslint.org/docs/rules/indent
  1  http://eslint.org/docs/rules/no-undef
  1  https://google.com/#q=import%2Ffirst
 @ ./src/main.js 3:0-24
 @ multi ./build/dev-client ./src/main.js

Answer 1

查看src / App.vue中的代码，您应该在已经存在的导入下添加导入，然后将Datepicker添加到组件列表中。

<script>
import sweetalert from 'sweetalert';
import Datepicker from 'vuejs-datepicker'
import TodoList from './components/TodoList';
import CreateTodo from './components/CreateTodo';    

export default {
  name: 'app',
  components: {
    TodoList,
    CreateTodo,
    Datepicker
  },
. 
.
.
</script>

Answer 2

你的答案很接近蒂姆，我只需要进行导入。以下是对我有用的内容：

<script>
import sweetalert from 'sweetalert';
import Datepicker from 'vuejs-datepicker';
import TodoList from './components/TodoList';
import CreateTodo from './components/CreateTodo';

export default {
  name: 'app',
  components: {
    TodoList,
    CreateTodo,
    Datepicker,
  },

将datepicker添加到简单的vuejs应用程序

2 个答案: